Question

我试图在角度2 rc2种子项目中使用ng2-bootstrap单选按钮。以下代码在我们的angular 2 rc1项目中没有任何问题。现在，我尝试使用https://github.com/mgechev/angular2-seed作为基础来创建种子项目，并且无法正确完成。

我以下列方式使用ng2-bootstrap radio-buttons指令：

<div class="btn btn-primary" [(ngModel)]="mode" btnRadio="EDITOR" uncheckable> 
     Editor 
</div>

我在 seed.config.ts 中加入了ng2-bootstrap和moment库。我尝试过很多变种（也有ng2-bootstrap/ng2-bootstrap等）。

paths: {
  ...
  'ng2-bootstrap': `${this.NPM_BASE}/ng2-bootstrap/`,
  'moment': `${this.NPM_BASE}moment/`
},
packages: {
    ...
    'ng2-bootstrap': { main: "ng2-bootstrap.js", defaultExtension: 'js' },
    'moment': { main: "moment.js", defaultExtension: 'js' },
}

我导入以下指令

import { BUTTON_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap';
import { ButtonRadioDirective } from 'ng2-bootstrap/ng2-bootstrap';

并使用我的组件

@Component({
  moduleId: module.id,
  selector: "editor",
  templateUrl: "editor.html",
  directives: [FORM_DIRECTIVES, CORE_DIRECTIVES, BUTTON_DIRECTIVES, 
  CodeMirrorComponent, ButtonRadioDirective]
})

我没有任何问题地构建项目，但是当我运行服务器时，我获得了以下运行时异常：

ORIGINAL EXCEPTION: No value accessor for ''

我确定在这里打破了与ngModel的双向绑定。我已将此代码与rc1 bundle一起使用，并且没有种子项目。现在我不确定，可能是什么问题 - 新的角度版本，或使用构建系统（在我的情况下 - gulp）。

我希望任何人都可以提供建议。非常感谢提前。

自2016年6月21日起编辑

使用过的软件包的版本如下：

"dependencies": {
  "@angular/common": "2.0.0-rc.2",
  "@angular/compiler": "2.0.0-rc.2",
  "@angular/core": "2.0.0-rc.2",
  "@angular/forms": "^0.1.0",
  "@angular/platform-browser": "2.0.0-rc.2",
  "@angular/platform-browser-dynamic": "2.0.0-rc.2",
  "@angular/router": "3.0.0-alpha.6",
  "es6-module-loader": "^0.17.8",
  "core-js": "^2.4.0",
  "rxjs": "5.0.0-beta.6",
  "systemjs": "0.19.26",
  "zone.js": "^0.6.12",
  "bootstrap": "^3.3.6",
  "ng2-bootstrap": "^1.0.17"
}

Answer 1

以下内容应该有效：

导入

import {AlertComponent} from 'ng2-bootstrap/ng2-bootstrap';

<强>路径

'ng2-bootstrap': `${this.NPM_BASE}ng2-bootstrap/bundles/ng2-bootstrap.js`, 'moment/*': `${this.NPM_BASE}moment/*`,

<强>包

'ng2-bootstrap': {defaultExtension: 'js'}, moment: { main: 'moment.js', defaultExtension: 'js' }

Answer 2

谢谢大家，我发现了问题和（暂时）解决方案。问题是 ng2-bootstrap 和 angular.forms 之间的冲突（我的版本是0.1.0）。该问题与此问题有关https://github.com/valor-software/ng2-bootstrap/issues/627。

我现在不使用角形式，并在 main.ts

中有简单的注释后续行

//import { disableDeprecatedForms, provideForms } from '@angular/forms/index';

bootstrap(AppComponent, [
   //disableDeprecatedForms(),
   //provideForms(),
   APP_ROUTER_PROVIDERS,
   {
      provide: APP_BASE_HREF,
      useValue: '<%= APP_BASE %>'
   }
]);

我的代码现在按预期工作。

在角度2 rc2种子项目中的ng2-bootstrap btnRadio。对ngModel的双向绑定被破坏了？

2 个答案: