Javascript Angularjs页上加载调用函数

我正在学习

AngularJS

。我有一些文章标签，点击一个按钮，每个文章页面都会显示出来，没有任何页面刷新。这是一个网页的网站。我想要的是，当加载文章id“showSelector”时，我想调用

myFunction（）

，并在这个函数中显示一个警报。但是警报没有显示出来

我该怎么做

 <article id="showSelector" class="panel" ng-controller="CinemaCtrl" onload="myFunction()">
      <header>
        <a ng-click="back()" class="icon fa-arrow-circle-left"></a><h2>Shows in {{getSelectedCinema()}}</h2>        
      </header>
      <p>
        These shows are played in our single room theatre. Select one to reserce a ticket for it.
      </p>
      <section>
        <div class="row">
          <div class="4u" ng-repeat="show in shows">
            <div class="movieCard">
              <a ng-click="selectShow(show)"></a>
              <h3>{{show.nameOfShow}}</h3>
              <h4>{{show.timeOfShow | date:'MMM d'}}</h4>
              <h4>{{show.timeOfShow | date:'HH:mm'}}</h4>
              <p>Free seats: {{show.reservations | freeSeatFilter}}</p>
            </div>
          </div>
        </div>
      </section>
      <script>
function myFunction() {
    alert("Page is loaded");
};
</script>
    </article>

在{{getSelectedCinema（）}中显示

这些节目在我们的单人间剧院上演。选择一个可为其重新选择票证。

{{show.nameOfShow}}
{{show.timeOfShow}日期：'MMM d'}
{{show.timeOfShow}日期：'HH:mm'}
免费座位：{show.reservations | freeSeatFilter}

函数myFunction（）{
警报（“页面已加载”）；
};

您应该从控制器调用此函数

angular.module('App', [])
  .controller('CinemaCtrl', ['$scope', function($scope) {
    myFunction();
  }]);

即使使用普通的javascript/html，您的函数也不会在页面加载时运行，因为您所做的只是定义函数，您永远不会调用它。这实际上与angular无关，但由于您使用angular，因此上述方法将是调用函数的“angular方式”

显然，最好还是在控制器中声明函数

---

编辑：事实上，我看到了您的“onload”-当angular将HTML注入DOM时，不会调用它。html永远不会“加载”（或者页面只加载一次）。

使用Angular的

ng init

代替onload

---

注意：这要求myFunction是

CinemaCtrl

作用域的属性。

这不是角度的方式，从html正文中删除该函数并在控制器中使用，或者使用

angular.element(document).ready

---

此处提供了更多详细信息：

您也可以使用以下代码

function activateController(){
     console.log('HELLO WORLD');
}

$scope.$on('$viewContentLoaded', function ($evt, data) {
    activateController();
});

$scope.fn_load=函数（）{
日志（“页面加载”）
};

---

这将完成此任务。

您可以将其直接用于$scope实例

     $scope.init=function()
        {
            console.log("entered");
            data={};
            /*do whatever you want such as initialising scope variable,
              using $http instance etcc..*/
        }
       //simple call init function on controller
       $scope.init();

---

为什么不将

myFuntcion

的逻辑放在CinemaCtrl中？无论何时渲染上面的视图，它都将运行。的可能副本

    var someVr= element[0].querySelector('#showSelector');
        myfunction(){
        alert("hi");
        }   
        angular.element(someVr).ready(function () {
           myfunction();
            });

     $scope.init=function()
        {
            console.log("entered");
            data={};
            /*do whatever you want such as initialising scope variable,
              using $http instance etcc..*/
        }
       //simple call init function on controller
       $scope.init();