簡體   English   中英

角度/離子ng-if

[英]Angular/Ionic ng-if

我正在構建的Ionic應用程序存在問題。

在特定屏幕上,該應用將使用div中的ng-repeat指令列出一個或多個名稱。 div還將具有一個select元素。 基於select元素的值,我希望另一個sub-div顯示或隱藏。 這是我到目前為止的內容:

<ion-list>
    <div class="item item-input item-select" ng-repeat="customer in data.customerList">
        <ion-checkbox class="checkbox-balanced" style="border:none;" ng-click="onCheckboxClick($event, customer.SubjectId)"></ion-checkbox>
        <div class="input-label item-text-wrap">{{customer.CustomerName}}</div>
        <select ng-model="customer.ServiceType" ng-options="o as o for o in data.serviceTypes" ng-disabled="customer.Served == false"></select>
        <div ng-if="customer.ServiceType == 'Non Personal'">
            <p>Div Stuff to Display Here</p>
        </div>
    </div>
</ion-list>

這是從控制器中檢索數據的方式:

$scope.data = {};
$scope.data.customerList = {};
$scope.data.serviceTypes = ['', 'Personal', 'Non-Personal'];

$http.get(ApiEndpoint.url + '/GetJobDetails?id=' + $scope.jobId).then(function(resp) {
    for (i = 0; i < resp.data.Customers.length; i++) {
        var newCustomer =
            {
                "CustomerName": resp.data.Customers[i].CustomerName,
                "SubjectId": resp.data.Customers[i].SubjectId,
                "Served": false,
                "ServiceType": ""
            };
        $scope.data.customerList[i] = newCustomer;
    }

}, function(err) {

});

我想做的是顯示div:

<div ng-if="customer.ServiceType == 'Non Personal'">
<p>Div Stuff to Display Here</p>
</div>

當選擇值等於“非個人”時。 當前,當選擇值更改時,沒有任何反應。 我嘗試將ng-if交換為ng-show,並且發生了相同的結果。

有人可以協助嗎?

<select ng-model="customer.ServiceType" ng-options="o as o for o in data.serviceTypes" ng-disabled="customer.Served == false" value="{{o}}"></select>

您需要將值設置為{{o}}

另外,您也可以使用track by

<select ng-model="customer.ServiceType" ng-options="o as o for o in data.serviceTypes track by o" ng-disabled="customer.Served == false"></select>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM