Angular JS雙向綁定不起作用

我無法在控制器中使用雙向綁定。有一些奇怪的東西，但我不明白。我的數據結構是一個包含字符串數組的javascript對象。Angular JS雙向綁定不起作用

$scope.schedule = { 
    schedule_name: "Test 123", 
    schedule_id: 1234, 
    dates: [{ 
     date: "2015-01-01" 
    }, { 
     date: "2015-02-01" 
    }, {...}] 
}

我從我的數據庫中檢索計劃，並將其置於UI中的列表中。 $scope.scheduleList的元素是可點擊的。如果用戶點擊一個時間表元素，那麼它將出現在屏幕上，包含時間表對象的所有屬性。

我使用ng-repeat="date in schedule.dates"迭代日期數組，並使用像這樣的ng-model="date.date"中的日期值。

我的問題是範圍變量schedule將不會更新任何更改。這裏是我的代碼的摘錄：

$scope.scheduleList = []; 
 
CommonDataService.get(URL).then(function(data) { 
 
    for (var i = 0; i < data.length; i++) { 
 
    data[i].dates.forEach(function(value, key) { 
 
     data[i].dates[key] = {date: $filter("date")(value, "EEE, dd.MM.yyyy")}; 
 
    }); 
 
    data[i].schedule_name = data[i].schedule_name.substr(4); 
 
    } 
 
    $scope.scheduleList = data; 
 
}); 
 

 
$scope.schedule = {}; 
 
$scope.showSchedules = function(schedule) { 
 
    $scope.schedule = schedule; 
 
} 
 

 
... 
 

 
$scope.save = function() { 
 
    console.log($scope.schedules); 
 
    //CommonDataService.add(URL, $scope.schedules).then(function(response) { 
 
    // console.log(response); 
 
    //}); 
 
};

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script> 
 
<body data-ng-app="rwk"> 
 
... 
 
    <div class="form-group col-lg-6" data-ng-repeat="date in schedule.dates track by $index" data-ng-if="key !== 'schedule_id' && key !== 'schedule_name'"> 
 
     <div class="col-lg-9"> 
 
     <p class="input-group pull-left"> 
 
      <input data-rwk-datepicker data-format="D, dd.mm.yyyy" id="{{$index}}" type="text" class="form-control" data-ng-model="date.date" data-ng-required="true" /> 
 
     </p> 
 
     </div> 
 
    </div> 
 
</body>

我，如果有人可以幫助我很幸運！在此先感謝！

來源

2015-04-28 Patrick Vogt

你在哪裏應用'ng-app'，在body或html標記中？看起來你已經忘記使用'ng-app'指令，因爲它似乎是從字面上呈現HTML標籤內容。通常情況下，Angular沒有告訴DOM的哪個部分需要管理。 –

範圍變量可能會更新，但除非通知它，否則角度可能不會被拾取。如果您以角度未檢測到的方式異步更新它，則它不會知道並且無法更新其他所有內容。看看'$ scope。$ apply'和'$ timeout'。難道那是...？ – deceze

你指的是哪些變化？ UI更改日期或服務請求更改？ – charlietfl

您可能會從外部角度範圍調用showSchedules()函數。你需要告訴角度在$scope.$apply(...)包裹函數體更新綁定：

$scope.schedule = {}; 
$scope.showSchedules = function(schedule) { 
    $scope.$apply(
     $scope.schedule = schedule; 
    ); 
}

你可以換調用showSchedules在$scope.$apply(...)電話也是如此。

來源

2015-04-28 16:27:27

showSchedules函數在哪裏？ – Joseph

謝謝，我修改了一下你的解決方案，它有效！ –

Angular JS雙向綁定不起作用

回答

相關問題