3

我正在尝试在 angular 2 rc2 种子项目中使用 ng2-bootstrap 单选按钮。以下代码在我们的 angular 2 rc1 项目中没有任何问题。现在我正在尝试创建一个https://github.com/mgechev/angular2-seed用作基础的种子项目，但无法正确执行。

我以下列方式使用 ng2-bootstrap 单选按钮指令：

<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 捆绑包一起使用，并且没有种子项目。现在我不确定，可能是什么问题 - 新的角度版本，或使用构建系统（在我的情况下 - gulp）。

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

编辑自 21.06.2016

使用的包的版本如下：

"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"
}
4

2 回答 2

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' }
于 2016-06-21T11:23:55.170 回答
1

谢谢大家，我找到了问题和（暂时）解决方案。问题是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 %>'
   }
]);

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

于 2016-06-21T21:20:18.840 回答