如何在angularJS中訪問Java腳本中的HTML變量

Question

我在angularJS中填寫選擇列表。 這是代碼。

<select class="form-control" ng-model="NewProduct.category" ng-options="category.id as category.name for category in Categories | orderBy:['name']" ng-change="update(NewProduct.category)" required></select>

更改時，它調用更新功能； 哪個打印categoryID。

$scope.update = function (value) {
    alert ($scope.NewProduct.category);
};

但我想在此更新功能中同時訪問categoryID和categoryName。 我試過了：

$scope.update = function (value) {
    alert ($scope.NewProduct.category.id);
    alert ($scope.NewProduct.category.name);

};

但是它會警告未定義，未定義。

如何在此更新函數中同時獲取categoryID和categoryName。

Answer 1

將您的html更改為此：

<select class="form-control" ng-model="NewProduct.category" ng-options="category as category.name for category in Categories | orderBy:['name']" ng-change="update(NewProduct.category)" required></select>

這會將整個類別存儲在NewProduct.category中，而不僅僅是ID

Answer 2

嘗試更改為：

$scope.update = function(value) {
   alert(value.id);
   alert(value.name);
};

Answer 3

您正在將當前類別傳遞給更新功能。 通過value參數訪問它。

$scope.update = function (value) {
    alert (value.id);
    alert (value.name);
};

Answer 4

您應該在ng-options傳遞一個對象，例如

ng-options="category as category.name for category in Categories | orderBy:['name']"

並且您將在更新功能中獲得完整的對象。

Answer 5

也許您應該在每個值的末尾添加toString() ：

alert (value.id.toString());
alert (value.name.toString());