Ionic 2 段不适用于 Angular 指令

Question

我试图创建动态生成的 Ionic 2 段按钮，但每次当我使用某些 Angular 指令时，它都会失败。我看到分段按钮，但单击不会更改任何内容，包括 ngModel 变量。参见示例：

工作静态示例：

<ion-segment [(ngModel)]="subsActiveDay">
    <ion-segment-button value="2016-03-01T00:00:00.000Z">
        1
    </ion-segment-button>
    <ion-segment-button value="2016-03-02T00:00:00.000Z">
    2
    </ion-segment-button>
</ion-segment>
{{subsActiveDay}}

不工作：

<ion-segment [(ngModel)]="subsActiveDay">
    <ion-segment-button *ngFor="#day of subs" [value]="day.date">
        {{day.datestamp | date}}
    </ion-segment-button>
</ion-segment>
{{subsActiveDay}}

在第二个示例中生成了按钮，但是没有默认选择的按钮并且 subsActiveDay 变量在点击后没有改变。我试图找出 ngFor 并使用组件中定义的两个测试变量作为值，但结果也失败了。

有什么想法可能有问题吗？

Answer 1

我刚刚在查看段源代码后找到了解决方法。所以你可以像这样使用 value 而不是 [value]：

<ion-segment [(ngModel)]="subsActiveDay">
    <ion-segment-button *ngFor="#day of subs" value="{{day.date}}">
        {{day.datestamp | date}}
    </ion-segment-button>
</ion-segment>
{{subsActiveDay}}

在segment.js的第98行有一行检查ngOnInit时是否出现value属性，像这样

SegmentButton.prototype.ngOnInit = function () {
    if (!util_1.isPresent(this.value)) {

希望对您有所帮助。

Ionic 2 段不适用于 Angular 指令

Ionic 2 segment not working with Angular directives

angularjs

ionic-framework

ionic2

angular