使用ui-view将angular应用程序链接到index.html后，无法获取html view

Question

我的HTML页面没有通过index.html中使用的ui-view进行路由。 但是，我在控制器中定义了所有声明。 我在控制器中使用$ stateProvider进入特定的HTML。 这会在浏览器URL位置显示“ .... index.html＃/ welcome”，但该页面未显示任何内容。 请帮助我摆脱这种情况。

的index.html

<!doctype html>
    <html>
        <head>
            <link    rel="stylesheet" href="bower_components/font-awesome-
 4.7.0/css/font-awesome.min.css">
            <link rel="stylesheet" href="lib/angular-loading-bar/loading-
 bar.css">
            <link rel="stylesheet" 
 href="bower_components/chosen/chosen.css">
            <!-- endbuild --> 



            <!-- build:css content/css/main.css -->
            <link rel="stylesheet" href="content/css/bootstrap.min.css">
            <link rel="stylesheet" href="content/css/bootstrap-
select.min.css">
            <link rel="stylesheet" href="content/css/style.css">
            <link rel="stylesheet" href="content/css/common.css">
        </head >

        <body >

            <!--[if lt IE 9]>
                <p class="browserupgrade">You are using an 
<strong>outdated</strong> browser. Please <a 
href="http://browsehappy.com/">upgrade your browser</a> to improve your 
experience.</p>
            <![endif]-->
       <div>
            <div  class="body-overlay" style="z-index:1051;">
                <div class="overlay-content" id="bodyOverlayContent">
                     <p></p> 
                </div>
            </div>
            <div class="main-section" ng-app="testApp">
                <div ui-view="welcome" ng-cloak>

            </div> 
     </div>
    </div>


                <script src="bower_components/angular/angular.js"></script>
            <script src="angular-ui-router.js"></script>
            <script src="mytest.controller.js"></script>  
            <script src="bower_components/jquery/dist/jquery.js"></script>
    </body>
    </html>

mytest.controller.js

  var app = angular.module('testApp', ['ui.router']);

  app.config(['$stateProvider', 
  '$urlRouterProvider',function($stateProvider, $urlRouterProvider) {
    $stateProvider
    .state('welcome', {
        url : '/welcome',
        templateUrl : 'welcome.html',
       controller : 'testController'
    });

    $urlRouterProvider.otherwise('/welcome');
    console.log($stateProvider);

  }]);

  app.controller('testController', function($scope) {
    $scope.showInfoMessages="Contact Information";
  });

welcome.html

  <div><p> Hi </p></div>

Answer 1

删除分配给ui-view的字符串

更改

  <div ui-view="welcome" ng-cloak>

对此

 <div ui-view ng-cloak=""></div>

还要在html标签上添加ng-app

演示