AngularJs ng-模型从 json 绑定

Question

我有以下下拉菜单：

          <h3>Selectize theme</h3>
  <p>Selected: {{produk.category}}</p>
  <ui-select ng-model="produk.category" theme="selectize" ng-disabled="disabled" style="width: 300px;">
    <ui-select-match >{{$select.selected.name}}</ui-select-match>
    <ui-select-choices repeat="cat in categories | filter: $select.search">
      <span ng-bind-html="cat.name | highlight: $select.search"></span>

    </ui-select-choices>
  </ui-select>

在angular中我得到一个json格式的数据：

   $scope.getProductToEdit = function(id){
      Account.getProductToEdit(id)
        .then(function(response){

            $scope.produk = response.data.product;

            //console.log($scope.produk); ---> return json
            return $scope.produk;
        })
        .catch(function(response){

        })
    }

if($stateParams.id){
    $scope.getProductToEdit($stateParams.id);
  }

看来我无法将 json 数据分配给 ng-model="produk.category" 但它适用于 <p>Selected: {{produk.category}}</p>

这是 json Object {category: 'Tours'}

返回的内容

谢谢！！

Answer 1

您面临的问题是您试图读取模型中不存在的属性。特别是在这一行：

<ui-select-match >{{$select.selected.name}}</ui-select-match>

从代码中您选择的值是 produk.category。里面只有字符串 "Tours"。 Javascript 中的字符串没有属性名称。

AngularJS 正常行为是在属性不存在时忽略。所以你什么也得不到。将其更改为：

<ui-select-match >{{$select.selected}}</ui-select-match>

将解决您的问题（因为现在您正在打印字符串，而不是字符串中名为 "name" 的不存在的属性）。

Answer 2

试试这个

  $scope.getProductToEdit = function(id){
  Account.getProductToEdit(id)
    .then(function(response){
        $scope.produk = {}
        $scope.produk.category = response.data.product.category;

        //console.log($scope.produk); ---> return json
        return $scope.produk;
    })
    .catch(function(response){

    })
}

AngularJs ng-模型从 json 绑定

AngularJs ng-model bind from json

javascript

json

angularjs

angular-ngmodel