Question

我遇到了选择框的问题。当我选择该选项时，我无法获得我刚刚选择的值。我读了很多答案，但似乎没有一个对我有用。这是我的代码。

HTML：

<select class="wide" style="width: 96%;height: 100px;" 
    ng-options="element as element.type for element in elements"
    ng-model="selectedType" >                                                                                             
    <option value="">Choose an option</option> 
</select>
<p> {{selectedType}} </p>

控制器：

elements:[
        {
            desc: "example1",
            article: "OF",
            type: "example1Type"
        },
        {
            desc: "example2",
            article: "P-8955625",
            type: "example2Type"
        }
    ];
$scope.selectedType = "";

<p> {{selectedType}} </p>没有显示任何内容。

提前致谢

Answer 1

需要在控制器范围中设置

elements。 e.g。

app.controller('ExCtrl', function($scope) {
  $scope.elements = [{
    desc: "example1",
    article: "OF",
    type: "example1Type"
  }, {
    desc: "example2",
    article: "P-8955625",
    type: "example2Type"
  }];
});

另外，将控制器连接到您的视图。 e.g。

<body ng-controller="ExCtrl">
  <select class="wide"
    ng-options="element.type for element in elements"
    ng-model="selectedType" >                                                                                             
    <option value="">Choose an option</option> 
  </select>
  <p>{{selectedType}} </p>
</body>

Et瞧！

请参阅 repl

Answer 2

as仅用于显示值，但ng-model表示整个选定项目。

所以你需要wirte：

 <p> {{selectedType.type}} </p>

https://embed.plnkr.co/bicmN1loBGdcxsWOLv6x/

Angularjs：选择ng-model不起作用

2 个答案: