AngularJS无法正常工作

时间:2016-10-20 13:26:40

标签: angularjs

我第一次使用AngularJS,我在这里写下了该页面的HTML脚本:

<!DOCTYPE html>
<html>
<head>
    <title>_LayoutPersonal</title>
    <link href="/Content/Site.css" rel="stylesheet" type="text/css" />
    <script src="/Scripts/jquery-3.1.0.min.js" type="text/javascript"></script>
    <script src="/Scripts/jquery-ui-1.12.0.min.js" type="text/javascript"></script>

    <script src="/Scripts/jquery.validate.min.js"></script>
    <script src="/Scripts/jquery.validate.unobtrusive.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>





    <script>
        alert("india");
        function questionController($scope) {
            $scope.queList = ['a', 'b'];
            alert("India");
        }
        var queApp = angular.module("queApp", []);
        queApp.controller("queCtrl", questionController);
    </script>


</head>
<body>
    <!-- Always on top: Position Fixed-->
<header>
    Stack Overflow
</header>
<div class="subheader">
    <div style="float:left;"><h1>Stack Overflow</h1></div>
    <div class="sidebar3">
        <input type="button" id="btnQuestions" value="Questions" onclick="location.href='/Question/Show'"/>
        <input type="button" id="btnJobs" value="Jobs" onclick="location.href='/Question/Show'"/>
        <input type="button" id="btnTags" value="Tags" onclick="location.href='/Question/Show'"/>
        <input type="button" id="btnUsers" value="Users" onclick="location.href='/Question/Users'"/>
        <input type="button" id="btnBadges" value="Badges" onclick="location.href='/Question/Badges'"/>
        <input type="button" id="btnAskQuestion" value="Ask Question" onclick="location.href='/Question/Ask'"/>
        <a href="/Question/Ask">Ask Question</a>
    </div>
</div>
<!-- Fixed size after header-->
<div class="content">
    <!-- Scrollable div with main content -->
    <div id="scrollable2">        

<h3>Questions</h3>

    <a href="/Question/Show/1">
        <div class="questionlistitem">
            <label for="Model_binding_MVC_3_not_working_as_expected">Model binding MVC 3 not working as expected</label>
            <label for="">9/14/2016 12:00:00 AM</label>
        </div>
    </a>
    <a href="/Question/Show/2">
        <div class="questionlistitem">
            <label for="Business_logic_layer_in_ASP_NET_MVC_-_Architecture">Business logic layer in ASP.NET MVC - Architecture</label>
            <label for="">9/10/2016 12:00:00 AM</label>
        </div>
    </a>
<div ng-controller="queCtrl">
    <div ng-repeat="question in queList">
        {{question}}
    </div>
</div>













    </div>
    <!-- Always on top. Fixed position, fixed width, relative to content width -->
    <div class="sidebar2">        

    <div class="metapost">
<h4 class="headertitle">Hot Meta Post</h4>
<div class="sidebarinnerdiv">Is it useful to edit a question I will vote to close? </div>
<div class="sidebarinnerdiv">Rewriting a Waffle question</div>
</div>

    <div class="networkquestions">
<h4>Hot Network Questions</h4>
<div class="sidebarinnerdiv">How to pronounce the English alphabet? (A, B, C, ...)</div>
<div class="sidebarinnerdiv">Why does the Black Lives Matter movement organize protests while the incident they're protesting is still under investigation?</div>
</div>


    </div>
</div>
<!-- Always at the end of the page -->
<footer>
    Copyright 2016, Stack Overflow
</footer>    
</body>
</html>

它无效,我在页面上看到{{question}}。我无法追查错误的来源。请帮我翻页。

2 个答案:

答案 0 :(得分:2)

您忘了添加ng-app="queApp"

function questionController($scope) {
  $scope.queList = ['a', 'b'];
}
var queApp = angular.module("queApp", []);
queApp.controller("queCtrl", questionController);
<!DOCTYPE html>
<html ng-app="queApp">

<head>
  <title>_LayoutPersonal</title>
  <link href="/Content/Site.css" rel="stylesheet" type="text/css" />
  <script src="/Scripts/jquery-3.1.0.min.js" type="text/javascript"></script>
  <script src="/Scripts/jquery-ui-1.12.0.min.js" type="text/javascript"></script>

  <script src="/Scripts/jquery.validate.min.js"></script>
  <script src="/Scripts/jquery.validate.unobtrusive.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>

</head>

<body>
  <!-- Always on top: Position Fixed-->
  <header>
    Stack Overflow
  </header>
  <div class="subheader">
    <div style="float:left;">
      <h1>Stack Overflow</h1>
    </div>
    <div class="sidebar3">
      <input type="button" id="btnQuestions" value="Questions" onclick="location.href='/Question/Show'" />
      <input type="button" id="btnJobs" value="Jobs" onclick="location.href='/Question/Show'" />
      <input type="button" id="btnTags" value="Tags" onclick="location.href='/Question/Show'" />
      <input type="button" id="btnUsers" value="Users" onclick="location.href='/Question/Users'" />
      <input type="button" id="btnBadges" value="Badges" onclick="location.href='/Question/Badges'" />
      <input type="button" id="btnAskQuestion" value="Ask Question" onclick="location.href='/Question/Ask'" />
      <a href="/Question/Ask">Ask Question</a>
    </div>
  </div>
  <!-- Fixed size after header-->
  <div class="content">
    <!-- Scrollable div with main content -->
    <div id="scrollable2">

      <h3>Questions</h3>

      <a href="/Question/Show/1">
        <div class="questionlistitem">
          <label for="Model_binding_MVC_3_not_working_as_expected">Model binding MVC 3 not working as expected</label>
          <label for="">9/14/2016 12:00:00 AM</label>
        </div>
      </a>
      <a href="/Question/Show/2">
        <div class="questionlistitem">
          <label for="Business_logic_layer_in_ASP_NET_MVC_-_Architecture">Business logic layer in ASP.NET MVC - Architecture</label>
          <label for="">9/10/2016 12:00:00 AM</label>
        </div>
      </a>
      <div ng-controller="queCtrl">
        <div ng-repeat="question in queList">
          {{question}}
        </div>
      </div>

答案 1 :(得分:1)

首先,您需要&#39; ng-app =&#34; queApp&#34;&#39;为了使用AngularJS(Basics AngularJS