Angular不显示输出

时间:2017-08-15 12:04:08

标签: javascript html angularjs

尝试过stackoverflow上的每个解决方案,但它没有解决我的问题, 我的输出没有显示。 输出确实出现在日志和其他地方,但由于某些原因,角度无法呈现它。

在我的真实场景中,我将从服务器接收数据,并且我已经模仿了我将在' controller.js'中获得的对象结构。文件

HTML

<!DOCTYPE html>
    <html lang="en">
        <head> 

        </head>

        <body>

            <div ng-app="application" ng-controller="controller">
            <ng-view>

            <h2> Todo List: </h2>

            <ul>

            <li> {{t}}</li>
            <li> {{s}}</li>

            </ul>


        </ng-view>
            </div>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
        <script src="application.js"></script>
        <script src="controller.js"></script>
        </body>

    </html>

Controller.js

   var app=angular.module('application', []);
   app.controller("controller", function($scope) {
        var d= [{'Task':'Say hi!','Status':'failed'}];

        $scope.t=d[0].Task;
        $scope.s=d[0].Status;

        console.log("Task",$scope.t);
        console.log("Status",$scope.s); 

});

的application.js

var app = angular.module("application", []);
 app.run(function(){
    console.log("App running!");
 });

3 个答案:

答案 0 :(得分:0)

你在这一行中有错误

 console.log(App running!");

你忘记了一个&#34;

应该是

   console.log("App running!");

解决您的代码正常工作。

答案 1 :(得分:0)

console.log中的语法错误,在App运行时缺少引号。

//script.js
var app = angular.module("application", []);
app.run(function() {
  console.log("App running!");
});

app.controller("controller", function($scope) {
  var d = [{
    'Task': 'Say hi!',
    'Status': 'failed'
  }];

  $scope.t = d[0].Task;
  $scope.s = d[0].Status;

  console.log("Task", $scope.t);
  console.log("Status", $scope.s);

});
<html lang="en">
<head>
</head>
<body>
  <div ng-app="application" ng-controller="controller">
    <ng-view>
      <h2> Todo List: </h2>
      <ul>
        <li> {{t}}</li>
        <li> {{s}}</li>
      </ul>
    </ng-view>
  </div>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
  <script src="script.js"></script>
</body>
</html>

答案 2 :(得分:0)

<!DOCTYPE html>
<html lang="en">
    <head> 
    </head>
    <body>
        <div ng-app="application" ng-controller="_controller">
            <h2> Todo List: </h2>
            <ul>
                <li> {{t}}</li>
                <li> {{s}}</li>
            </ul>
        </div>

        <script>            
var app=angular.module('application', []);
app.controller("_controller", function($scope) {
    var d= [{'Task':'Say hi!','Status':'failed'}];

    $scope.t=d[0].Task;

    $scope.s=d[0].Status;

    console.log("Task",$scope.t);
    console.log("Status",$scope.s); 
});


app.run(function(){
    console.log("App running!");
});            
</script>
</body>

</html>