ng-selected在選擇框中不適用於ng模型 - Angularjs

雖然在選擇框中使用了ng模型，但ng-selected也用於選項，但某些條件下時間ng-selected不起作用。ng-selected在選擇框中不適用於ng模型 - Angularjs

如果我將刪除ng-model比ng-selected正在工作，但是如果我將刪除ng-model而不是如何獲得控制器中的選擇框的值。

請幫忙！

這裏是我的代碼...

HTML：

<select class="form-control" ng-change="accessModeSelected()"> 
    <option ng-selected="mode.status == '1'" ng-repeat="mode in storageResult.accessMode" ng-value="mode.name" name="accessMode{{$index}}" id="accessMode"> 
      {{mode.name}} 
    </option> 
</select>

AngularJS：

$scope.storageResult = { 
      "storageAccount":"Enable", 
      "user": "sdcard", 
      "pass": "sdcard", 
      "wifiIP": "0", 
      "ipAddr": "0", 
      "accessMode": [ 
       {"name": "Local Storage","status": "0"}, 
       {"name":"WiFi Storage", "status": "1"}, 
       {"name":"Internet Storage", "status": "0"} 
      ] 
     }

來源

2016-09-23 PiyaModi

有你嘗試使用ng-options而不是ng-repeat？ https://docs.angularjs.org/api/ng/directive/ngOptions – JanR

是！我試過了。但ng-option也不起作用。 – PiyaModi

我發過來的代碼，一旦我在plunkr中嘗試過。這是在plunkr工作，但不是在我的應用程序。我不知道我的應用程序在什麼位置。 – PiyaModi

使用ng-options和ng-init（設置默認值），而不是ng-repeat。

ng-options是專門爲select

<select class="form-control" ng-init="statusselect='WiFi Storage'" ng-model="statusselect" ng-options="mode.name as mode.name for mode in storageResult.accessMode"> 

</select> Selected Value : {{statusselect}}

FIDDLE

編輯：使用ng-repeat

我寧願ng-options，但如果你想使用ng-selected與ng-repeat你需要提供默認選擇的值爲ng-model從controller

<select class="form-control" ng-model="statusselect"> 
    <option ng-selected="{{mode.name == statusselect}}" ng-repeat="mode in storageResult.accessMode" value="{{mode.name}}" name="accessMode{{$index}}" id="accessMode"> 
      {{mode.name}} 
    </option> 
</select> Selected Value : {{statusselect}}

內部控制

$scope.storageResult = { 
      "storageAccount":"Enable", 
      "user": "sdcard", 
      "pass": "sdcard", 
      "wifiIP": "0", 
      "ipAddr": "0", 
      "accessMode": [ 
       {"name": "Local Storage","status": "0"}, 
       {"name":"WiFi Storage", "status": "1"}, 
       {"name":"Internet Storage", "status": "0"} 
      ] 
     } 
    $scope.statusselect = $scope.storageResult["accessMode"][1]["name"];

FIDDLE

來源

2016-09-23 05:52:21 Nishant123

嗨Nishant！感謝您的回答...但如果我將選擇另一個選項，那時我需要該名稱作爲輸入。在這裏我們只會獲得狀態。所以根據我不能更新我的數據庫哪種模式啓用。總之我想模式名稱ng模型 – PiyaModi

@PiyaModi我已經更新了我的答案。現在模式名稱應存儲在ng模型中。除了select之外的「選定的值：」給出了存儲在ng模型中的值。 – Nishant123

@PiyaModi通過「總之我想在ng模型中的模式名稱」你的意思是你想要的東西像這樣'ng-model =「mode.name」' Is this [this]（https：// jsfiddle .net/Kunalh/LkLask7y/11 /）你想要什麼？ – Nishant123

使用NG選項，而不是NG重複

<select ng-model="status" ng-options="mode.status as mode.name for mode in storageResult.accessMode">

和在控制器

app.controller("dobController", ["$scope", "$http", 
    function($scope, $http) { 

    $scope.storageResult = { 
     "storageAccount": "Enable", 
     "user": "sdcard", 
     "pass": "sdcard", 
     "wifiIP": "0", 
     "ipAddr": "0", 
     "accessMode": [{ 
     "name": "Local Storage", 
     "status": "0" 
     }, { 
     "name": "WiFi Storage", 
     "status": "1" 
     }, { 
     "name": "Internet Storage", 
     "status": "0" 
     }] 
    }; 
    $scope.status = '1'; 

    } 
]);

DEMO

來源

2016-09-23 05:39:56 Sajeetharan

嗨Sajeetharan！感謝您的回答...但如果我將選擇另一個選項，那時我需要該名稱作爲輸入。在這裏我們只會獲得狀態。所以根據我不能更新我的數據庫，哪種模式啓用。總之我想模式名稱ng模型 – PiyaModi

我敢肯定有很多的方法來回答這個問題，很多答案已經提供，但基於在OP的問題上如何發送'mode.name'到ng-model我已經在下面使用ng-options解釋。

在您的JS

var app = angular.module('todoApp', []); 

    app.controller("dobController", ["$scope", "$http", 
     function($scope, $http) { 


      $scope.storageResult = { 
       "storageAccount": "Enable", 
       "user": "sdcard", 
       "pass": "sdcard", 
       "wifiIP": "0", 
       "ipAddr": "0", 
       "accessMode": [{ 
        "name": "Local Storage", 
        "status": "0" 
       }, { 
        "name": "WiFi Storage", 
        "status": "1" 
       }, { 
        "name": "Internet Storage", 
        "status": "0" 
       }] 
      }; 
      $scope.status = $scope.storageResult.accessMode[0].name; 
      $scope.selectedItem = ''; 

     } 
    ]);

在你的HTML模式名稱綁定到NG-模型遵循這一點。

<select ng-model="status" ng-options="mode.name as mode.name for mode in storageResult.accessMode">

要綁定整個對象，你可以試試下面的語法

<select ng-model="status" ng-options="mode as mode.name for mode in storageResult.accessMode">

對於像

$scope.status = $scope.storageResult.accessMode[0];

在這裏，你的JS $scope.status這使小的變化是DEMO plunker

來源

2016-09-23 07:16:53

ng-selected在選擇框中不適用於ng模型 - Angularjs

回答

相關問題