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

回答

相关问题