ng应用程序使脚本无限运行

ng-app making the script run to infinity

本文关键字:无限 运行 脚本 应用程序 ng      更新时间:2023-09-26

我正在使用asp.net web应用程序空模板开发一个有角度的应用程序,我在使用ng应用程序时遇到了问题,当我使用它并将其留空时,$routeProvider不会被实例化,但当我在模块名称中指定ng app="myApp"时,正文的内容开始重复到无限循环。我肯定我错过了一些基本的东西,但这个问题让我抓狂感谢

这是我的html代码

这是主菜

<a href="#/view1">view1</a>
<div>
    <div ng-view></div>
</div>
<script src="Scripts/angular.js"></script>
<script src="Scripts/angular-route.js"></script>
<script src="app.js"></script>

这是我的应用程序代码

(function () {
    'use strict';
    var app = angular.module('myApp', ['ngRoute']);
    app.config([
        '$routeProvider', function ($routeProvider) {
            $routeProvider.when('/', {
                templateUrl: 'index.html',
                controller: 'main'
            }).when('/view1', {
                templateUrl: 'view1.html',
                controller: 'main'
            }).otherwise({
                redirectTo: '/'
            });
        }
    ]);
    app.controller('main', function ($scope) {
        setTimeout(function() {
            alert("from set");
        },10000);
    });
})();

这里的问题是index.html不是应该加载到ng-app中的模板,它是外壳页面。你正在一遍又一遍地加载整个应用程序,产生如下内容:

<a href="#/view1">view1</a>
<div>
  <a href="#/view1">view1</a>
  <div>
    <a href="#/view1">view1</a>
    <div>
      <a href="#/view1">view1</a>
      <div>
        //...  more and more loaded here
      </div>
      <script src="Scripts/angular.js"></script>
      <script src="Scripts/angular-route.js"></script>
      <script src="app.js"></script>
    </div>
    <script src="Scripts/angular.js"></script>
    <script src="Scripts/angular-route.js"></script>
    <script src="app.js"></script>
  </div>
  <script src="Scripts/angular.js"></script>
  <script src="Scripts/angular-route.js"></script>
  <script src="app.js"></script>
</div>
<script src="Scripts/angular.js"></script>
<script src="Scripts/angular-route.js"></script>
<script src="app.js"></script>

基本上永远。

相反,您应该只在路线中加载模板。

您的默认路由是否将页面加载到自身中?

    $routeProvider.when('/', {
        templateUrl: 'index.html', <----- ???
        controller: 'main'
    })