Угловая JS двусторонняя привязка не работает

Я не могу использовать двустороннюю привязку в контроллере. Есть что-то странное, но я этого не понимаю. Моя структура данных - это объект javascript, содержащий массив строк.Угловая JS двусторонняя привязка не работает

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

Я извлекаю расписания из своей базы данных и размещаю их в списке в пользовательском интерфейсе. Элементы $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

какие изменения вы имеете в виду? Изменения пользовательских настроек дат или изменений в запросе на обслуживание? – 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

Спасибо, я немного изменил ваше решение, и оно сработало! –

Угловая JS двусторонняя привязка не работает

ответ

Смежные вопросы