Angularjs模型不绑定到视图

时间:2015-08-11 13:16:10

标签: javascript angularjs

我的观点中有以下代码......

<ol class="breadcrumb">
    <li><a href="#/dashboard" id="breadcrumb-dashboard">Dashboard</a></li>
    <li><a href="#/restaurants">Restaurants</a></li>
    <li class="active">{{ restaurant.name }}</li>
</ol>

...

<label for="restaurant-name">Name</label>
<input type="text" id="restaurant-name" class="form-control"
       ng-model="restaurant.name" placeholder="Name">

我的控制器看起来像这样......

req = {
   method: "GET",
   url: "data/new_restaurant.json",
   headers: {
      "Content-Type": "application/json"
   }
};

$http(req).then(function(response) {
   $scope.restaurant = response.data;
}

JSON数据文件如下所示。

{
   name: "Bob's Bellicose Burritos"
}

我遇到的问题是,痕迹中的第一个restaurant.name完美无缺。但是,文本输入字段不反映restaurant.name的当前值,并且不会绑定,以便在文本字段中输入内容时更新。我将$ scope,$ routeParams和$ http导入控制器。

我完全难过了。当我调试时,控制台显示$ scope.restaurant对象具有正确的信息。更改文本字段并不会对$ scope.restaurant对象进行任何更改。

另外,我在$ scope.restaurant对象上有很多字段,但它们都没有工作。我没有想到复制/粘贴一堆垃圾代码会有所帮助。如果需要,我很乐意分享更完整的代码清单。

感谢你给我的任何帮助。这让我在桌子上敲了敲头。

1 个答案:

答案 0 :(得分:0)

试试这个...

<input type="text" id="restaurant-name" class="form-control"
   ng-model="name" placeholder="Name">

 $http(req).then(function(response) {
        $scope.restaurant = response.data;
        $scope.name=$scope.restaurant.name
  }