Угловой контроллер JS - проблема с областью (возможно)

0

В моем HTML есть следующее:

<body ng-controller = "Control as control">
<button ng-click = "control.prepareAction()">Do Action </button>
<div id="one" ng-hide = "!control.showOne" >
    <div>
      <h6> {{control.name}}</h6>
      <p> Bills Sponsored: {{control.count}} <p>
  </div>

</body>

И в моем Javascript:

var vm = this;
vm.name = "My Name"
vm.prepareAction = function(){
  action(parseFirst(), parseLast()); //The two parse functions simply get values from an HTML form. This works correctly.
}
function action(first, last) {

      $.post('php/one.php', {
          first: first,
          last: last
        },
        function(data) {
          create(JSON.parse(data));
        });
      return values;
      }

    function create(data) {
      var countArray = data[0];
      vm.count = countArray[0];
      vm.showOne = true;
    }

Эта функция не обновляет значения showOne (div всегда скрыт) или count (он пуст, когда я устанавливаю ng-hide в false) в HTML. Однако, когда я устанавливаю значение ng-hide в false, оно правильно отображает имя. Это заставляет меня думать, что это проблема с областью, однако, когда я печатаю значение vm на консоли, значения для showOne и count правильны. Это подтверждается расширением Chrome ng-inspector.

  • 0
    Вам нужно проверить несколько вещей, сначала проверьте, успешно ли выполняется запрос на публикацию и вызывает ли он функцию создания, а также проверьте, что вместо использования $ .post используйте службу $ http для angular. И попробуйте использовать $ scope. $ Apply () в последней строке функции create, и если она работает, то, очевидно, это проблема самого $ .post.
  • 0
    Я могу точно подтвердить, что вызывается create, потому что когда я console.log (vm) показывает правильное значение count и показывает showOne как true. Должен ли я попробовать Angular HTTP?
Теги:
controller

2 ответа

2
Лучший ответ

Фактически вы используете $.post, который находится вне контекста угловых js, поэтому из метода создания цикл дайджест работает правильно. Поэтому для его решения есть два варианта.

Либо вместо $.post вам нужно использовать

$http({
  method: 'POST',
  url: 'php/one.php'
}).then(function successCallback(response) {
   create(JSON.parse(response));
}, function errorCallback(response) {
});

Или вам нужно немного изменить функцию создания

function create(data) {
  var countArray = data[0];
  vm.count = countArray[0];
  vm.showOne = true;
  $scope.$apply();
}

И в обоих случаях вам необходимо ввести $ http & $ scope в контроллер соответственно.

Поделиться
0

Попробуйте добавить функцию обновления в vm.

vm.action = action;

Если вы этого не сделаете, его нельзя вызывать за пределами закрытия (т.е. В вашем html).

Поделиться
  • 0
    Какой из них вы подразумеваете под обновлением? Действие? Или новая функция?
  • 0
    Извините, я на мобильном телефоне, отредактировал мой ответ. Я имел в виду действие, а не обновление
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню