Question

我试图创建动态生成的Ionic 2段按钮，但每当我使用某些Angular指令时，它都会失败。我看到了段按钮，但是点击并没有改变任何东西，包括ngModel变量。见例：

使用静态示例：

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

不工作：

    public class Model
    {
        public string Data { get; set; }
    }

    [HttpGet]
    public JsonResult GetModel(/* can use params here if required */)
    {
        var model = new Model { Data = "Some data" };
        return Json(model, JsonRequestBehavior.AllowGet);
    }

    [HttpPost]
    public JsonResult PostModel(Model model)
    {
        var result = new { status = "success"};
        return Json(result);
    }

在第二个示例中生成按钮，但没有默认选定按钮，并且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}}

有一行检查value属性是否出现在ngOnInit或不出现在第98行的segment.js中

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

希望这可以帮到你。

Ionic 2段不使用Angular指令

1 个答案: