Angular: ng-init не запускается при загрузке

Я видел несколько примеров об этой проблеме ng-init, хотя я, похоже, не нашел тот, который ссылается на него с помощью контроллера.

Я вызвал функцию в контроллере, получив следующее в html файле

Он запускается, но выполняется до того, как компоненты загрузились на экран.

Ответы

Ответ 1

ng-init должен работать так, потому что он использовался для инициализации данных.

Очень простой пример:

<ul ng-init="list = [1,2,3,4]">
  <li ng-repeat="l in list"></li>
</ul>

Если вы пытаетесь запустить что-то во время загрузки вашего контроллера, это намного проще, чем вы думали:

app.controller('mainCtrl', function ($scope) {

  var init = function ($scope) {
    // do whatever you need to do to initialize your controller
    $scope.someData = ["Hey", "I'm", "Alive"]
    $scope.otherData = localStorage.getItem('myBackup')
  }

  init()

})

Или даже проще, если вам не нужна функция (без закрытия или что-то еще)

app.controller('mainCtrl', function ($scope) {

  // do whatever you need to do to initialize your controller
  $scope.someData = ["Hey", "I'm", "Alive"]
  $scope.otherData = localStorage.getItem('myBackup')

})

Изменить -, если вы используете ngView:
Чтобы код работал, когда страница полностью загружена, вы должны установить наблюдателя на событие $viewContentLoaded, например:

  $scope.$on('$viewContentLoaded', function(){
    //Here your view content is fully loaded !!
  });

app.controller('mainCtrl', function ($scope) {

  // This event is triggered when the view has finished loading
  $scope.$on('$viewContentLoaded', function() {

    $scope.someData = ["Hey", "I'm", "Alive"]
    $scope.otherData = localStorage.getItem('myBackup')      

  })    
})

Ответ 2

другой вариант использует jquery. Это подойдет, если вы зависите от многих элементов. Но обязательно загрузите jquery с версией, которую вы выбрали для проекта. загрузка JQuery (вставить версию, где это...):

<script src="https://code.jquery.com/jquery-..."></script>

код js:

$(document).ready(function() { 
        alert("do something");
    });