标签: angular

"ng-bootstrap"和"ngx-bootstrap"有什么区别？它们是否相互关联？或者它们只是并发实现？

有人和他们一起工作,可以给出/解释两者的利弊吗？

使用"ng-bootstrap"我的意思是https://ng-bootstrap.github.io/#/home和

与"ngx-bootstrap"我的意思是http://valor-software.com/ngx-bootstrap/.

两者都与Angular 4(不是AngularJS!)和Bootstrap 4有关.

请注意,这不是ngx-bootstrap和ng2 bootstrap之间重复的问题？.

我觉得我错过了什么.当我尝试data attribute在我的中使用时template,像这样:

<ol class="viewer-nav">
    <li *ngFor="#section of sections" data-value="{{ section.value }}">
        {{ section.text }}
    </li>
</ol>

Angular 2 崩溃:

EXCEPTION:模板解析错误:无法绑定到"sectionvalue",因为它不是已知的本机属性("

] data-sectionvalue ="{{section.value}}"> {{section.text}}

我显然遗漏了一些语法,请帮忙.

我正在关注angular.io这个教程

正如他们所说,我创建了hero.spec.ts文件来创建单元测试:

import { Hero } from './hero';
describe('Hero', () => {
  it('has name', () => {
    let hero: Hero = {id: 1, name: 'Super Cat'};
    expect(hero.name).toEqual('Super Cat');
  });
  it('has id', () => {
    let hero: Hero = {id: 1, name: 'Super Cat'};
    expect(hero.id).toEqual(1);
  });
});

单元测试就像一个魅力.问题是:我看到一些错误,在教程中提到:

我们的编辑器和编译器可能会抱怨他们不知道是什么it ,expect因为他们缺少描述Jasmine的打字文件.我们现在可以忽略那些烦人的抱怨,因为它们是无害的.

他们确实忽视了它.即使这些错误是无害的,但当我收到大量错误时,我的输出控制台看起来并不好看.

我得到的例子:

找不到名字'describe'.

找不到名字'它'.

找不到名字'期待'.

我该怎么办才能修复它？

拥有此项目依赖项:

  "dependencies": {
    "@angular/common": "2.0.0-rc.6",
    "@angular/compiler": "2.0.0-rc.6",
    "@angular/core": "2.0.0-rc.6",
    "@angular/forms": "2.0.0-rc.6",
    "@angular/http": "2.0.0-rc.6",
    "@angular/platform-browser": "2.0.0-rc.6",
    "@angular/platform-browser-dynamic": "2.0.0-rc.6",
    "@angular/router": "3.0.0-rc.2",
    "ng2-bootstrap": "^1.1.1",
    "reflect-metadata": "^0.1.8",
    "core-js": "^2.4.0",
    "es6-module-loader": "^0.17.8",
    "rxjs": "5.0.0-beta.11",
    "systemjs": "0.19.27",
    "zone.js": "0.6.17",
    "jquery": "3.0.0",
  }

这个登录模板:

<form #loginForm="ngForm" (ng-submit)="authenticate(loginForm.value)">
</form>

而这个登录组件:

import { Component } from '@angular/core';
import {Http, Headers}  from '@angular/http';
@Component({
    moduleId: module.id,
    selector: 'login-cmp',
    templateUrl: 'login.component.html'
})
export class LoginComponent {
  constructor($http: Http) {
    this.$http = $http;
  }
  authenticate(data) {
   ... 
  }
}

我有这个错误:

zone.js?1474211973422:484 Unhandled …

我刚刚从Angular 2 beta16升级到beta17,后者又需要rxjs 5.0.0-beta.6.(更改日志:https://github.com/angular/angular/blob/master/CHANGELOG.md#200-beta17-2016-04-28)在beta16中,所有关于Observable/map功能的都很好.升级后出现以下错误,当typescript尝试转换时出现:

1. 类型'Observable'上不存在属性'map'(我在地图中使用了带有observable的地图)
2. c:/path/node_modules/rxjs/add/operator/map.d.ts(216):error TS2435:Ambient模块不能嵌套在其他模块或名称空间中.
3. c:/path/node_modules/rxjs/add/operator/map.d.ts(2,16):错误TS2436:环境模块声明无法指定相对模块名称.

我已经看到了这个问题/答案,但它没有解决问题: Angular2 beta.12和RxJs 5 beta.3的可观察错误

我的appBoot.ts看起来像这样(我已经引用了rxjs/map):

///<reference path="./../node_modules/angular2/typings/browser.d.ts"/>
import {bootstrap} from "angular2/platform/browser";
import {ROUTER_PROVIDERS} from 'angular2/router';
import {HTTP_PROVIDERS} from 'angular2/http';
[stuff]
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';
import {enableProdMode} from 'angular2/core';
import { Title } from 'angular2/platform/browser';


//enableProdMode();
bootstrap(AppDesktopComponent, [
    ROUTER_PROVIDERS,
    HTTP_PROVIDERS,
    Title
]);

有人知道发生了什么事吗？

我想动态创建模板.这应该用于ComponentType在运行时构建一个并在托管组件内部放置(甚至替换)它.

直到我使用RC4 ComponentResolver,但RC5我收到消息:

ComponentResolver不推荐用于动态编译.使用ComponentFactoryResolver连同@NgModule/@Component.entryComponents或ANALYZE_FOR_ENTRY_COMPONENTS提供商,而不是.对于仅运行时编译,您也可以使用Compiler.compileComponentSync/Async.

我发现了这个(官方的angular2)文件

Angular 2同步动态组件创建

并了解我可以使用其中之一

• 一种动态的ngIf用ComponentFactoryResolver.如果我将已知组件传递到托管内部@Component({entryComponents: [comp1, comp2], ...})- 我可以使用.resolveComponentFactory(componentToRender);
• 真正的运行时编译,带Compiler...

但问题是如何使用它Compiler？上面的注释说我应该打电话:Compiler.compileComponentSync/Async- 那怎么样？

例如.我想为一种设置创建(基于一些配置条件)这种模板

<form>
   <string-editor
     [propertyName]="'code'"
     [entity]="entity"
   ></string-editor>
   <string-editor
     [propertyName]="'description'"
     [entity]="entity"
   ></string-editor>
   ...

在另一种情况下这个(string-editor被替换text-editor)

<form>
   <text-editor
     [propertyName]="'code'"
     [entity]="entity"
   ></text-editor>
   ...

等等(editors属性类型的不同数量/日期/引用,跳过一些用户的某些属性......).即这是一个例子,真正的配置可以生成更多不同和复杂的模板.

该 …

我从Angular 2收到此错误

core.umd.js:5995 EXCEPTION:未捕获(在承诺中):错误:app/model_exposure_currencies/model_exposure_currencies.component.html:57:18中的错误:如果在表单标记中使用了ngModel,则name属性必须为set或表单控件必须在ngModelOptions中定义为"standalone".

      Example 1: <input [(ngModel)]="person.firstName" name="first">
      Example 2: <input [(ngModel)]="person.firstName" [ngModelOptions]="{standalone: true}">
<td *ngFor="let lag of ce.lags">
    <div class="form-group1">
        <input name="name" [(ngModel)]="lag.name" [ngModelOptions]="{standalone: true}"  class="form-control" pattern="[0-9]*(\.[0-9]+)?" required>
    </div>

</td>

这就是我使用表单标签的方式:

 <form #f="ngForm" (ngSubmit)="onSubmit()">

AngularJS有&参数,你可以将回调传递给指令(例如AngularJS的回调方式.是否可以将回调作为@InputAngular组件传递(如下所示)？如果不是,最接近什么是什么？ AngularJS呢？

@Component({
    selector: 'suggestion-menu',
    providers: [SuggestService],
    template: `
    <div (mousedown)="suggestionWasClicked(suggestion)">
    </div>`,
    changeDetection: ChangeDetectionStrategy.Default
})
export class SuggestionMenuComponent {
    @Input() callback: Function;

    suggestionWasClicked(clickedEntry: SomeModel): void {
        this.callback(clickedEntry, this.query);
    }
}


<suggestion-menu callback="insertSuggestion">
</suggestion-menu>

一旦Angular应用程序进入生产阶段,您如何部署它们？

到目前为止我所见过的所有指南(甚至在angular.io上)都指望服务器和browserSync的lite服务器反映变化 - 但是当你完成开发时,你如何发布应用程序？

我是否导入页面.js上的所有已编译文件index.html或使用gulp缩小它们？他们会工作吗？在生产版本中我是否完全需要SystemJS？

我知道我可以将参数传递routerLink给路由,例如

/user/:id

通过写作

[routerLink]="['/user', user.id]"

但是这个路线怎么样:

/user/:id/details

有没有办法设置此参数或我应该考虑不同的URL方案？