Почему мой угловой JS не обновляется правильно в DOM?

Итак, я работаю над приложением с маршрутами и параметрами AngularJS. У меня установлены мои контроллеры, и по какой-то причине, когда я перехожу на одну из страниц, мое приложение не вытягивает массив из кода angularJS и не добавляет в мои элементы! Есть идеи?Почему мой угловой JS не обновляется правильно в DOM?

Вот мой угловой:

.controller("foodController", function ($scope) { 
    $scope.addItem; 
    $scope.foodItem = ""; 

    $scope.foodArray = ['Milk', 'PB&J']; 

    //add items here 
    $scope.addItem = function() { 
     /*if ($scope.foodItem = '') { 
      alert('What did the child eat?'); 
     } else {*/ 
     $scope.foodArray.push($scope.foodItem); 
     $scope.foodItem = ''; 
    }; 
});

Вот мой HTML:

<body ng-app="myApp" ng-controller="foodController"> 

<form ng-submit="addItem()"> 
    <h1>Food Chart</h1> 
    <input type="text" placeholder="What did the child eat today?" ng-model="foodItem" /> 
    <button type="submit" id="submit">Submit</button> 
</form> 
{{ foodItem }} 
<section> 
    <h1>Food Log</h1> 
    <tr ng-repeat="item in foodArray"> 
     <td> {{ item }}</td> 
     <td> 
      <button ng-click="removeItem(item)"> Remove Item</button> 
     </td> 
    </tr> 
</section>

Спасибо заранее!

источник

2015-10-16 Xiggy

Я не вижу, где вы указываете, какие контроллер обертывает ваш HTML. – Marc

Я снял тег тела, когда копирую/вставляю! Виноват! – Xiggy

'' {{foodItem}} 'отображается правильно? –

Вам нужна таблица для итерации по строкам с tr

Попробуйте вместо этого:

<div ng-controller="foodController"> 
    <form ng-submit="addItem()"> 
    <h1>Food Chart</h1> 
    <input type="text" placeholder="What did the child eat today?" ng-model="foodItem"/> 
    <button type="submit" id="submit">Submit</button> 
    </form> 
    {{ foodItem }} 
    <section> 
    <h1>Food Log</h1> 
    <table> 
     <tbody> 
     <tr ng-repeat="item in foodArray"> 
     <td> {{ item }}</td> 
     <td> 
      <button ng-click="removeItem(item)"> Remove Item</button> 
     </td> 
     </tr> 
     </tbody> 
    </table> 
    </section> 
</div>

источник

2015-10-16 18:46:42 arg20

Кстати, я добавил div с ng-контроллером, если вы используете маршрутизацию или объявили свой контроллер вне кода, который вы указали, удалите этот div – arg20

. Идем. Спасибо. Я не тратил слишком много времени на использование таблиц, поэтому я пытаюсь использовать их в этом проекте. Спасибо огромное! Прекрасно работает! – Xiggy

И да, я просто добавил в теги

и . Не могу поверить, что я их забыл! – Xiggy

обертывания вы тр в элементе таблицы

<section> 
     <h1>Food Log</h1> 
     <table> 

     <tr ng-repeat="item in foodArray"> 
     <td> {{ item }}</td> 
     <td> 
      <button ng-click="removeItem(item)"> Remove Item</button> 
     </td> 
     </tr> 
     </table> 

    </section>

Вот рабочий шлепнуть http://plnkr.co/edit/JYE3tVLubyM6FDbRm54k?p=preview

источник

2015-10-16 18:49:12 TimCodes

Хотел бы я нажать «принять» для вас обоих! Однако, спасибо! Мне определенно нужно больше работать со столами и практиковать с ними самостоятельно. – Xiggy

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

Почему мой угловой JS не обновляется правильно в DOM?

ответ

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