我在angularjs做了什么错误?

时间:2017-05-13 06:08:50

标签: angularjs sublimetext3

我尝试更改模块varialbe

<ul>
    <li ng-controller="ulCtrl"><a ng- href="" class ="active" >{{customers}}</a></li>
    <li><a ng-href="#JOBS">JOBS</a></li>
    <li><a ng-href="#ESTIMATES" >ESTIMATES</a></li>
    <li><a ng-href="#INVOICE" >INVOICE</a></li>
    <li class="right"><a ng-href="#ABOUT">ABOUT</a></li>
</ul>

控制器

var demoapp = angular.module("myApp", []);

demoapp.controller("MyCtrl", function($scope) {
    $scope.image = "media.licdn.com/mpr/mpr/shrink_200_200/…" }); 

demoapp.controller("ulCtrl", function($scope) { 
    $scope.customers = "CUSTOMERSSS" });

运行代码后,我得到了这个:{{customers}}

2 个答案:

答案 0 :(得分:-2)

您可能已经发布了部分代码,根据您的评论,您的控制器应如下所示。

<强>样本

var demoapp = angular.module("myApp",[]); 
demoapp.controller("ulCtrl",function($scope){ 
$scope.customers = "CUSTOMERSSS" ;
}); 
<!doctype html>
<html ng-app="myApp">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script>  
  </head>
  <body>
  <div ng-controller="ulCtrl" style='padding: 40px;'> 
  <li ng-controller="ulCtrl"><a ng- href="" class ="active" >{{customers}}</a></li>
    <li><a ng-href="#JOBS">JOBS</a></li>
    <li><a ng-href="#ESTIMATES" >ESTIMATES</a></li>
    <li><a ng-href="#INVOICE" >INVOICE</a></li>
    <li class="right"><a ng-href="#ABOUT">ABOUT</a></li>
</ul>
   </div>
  </body>
</html>

答案 1 :(得分:-2)

这是你的答案:

<!DOCTYPE html>
<html ng-app="app">

<head>
  <link data-require="bootstrap-css@3.1.1" data-semver="3.1.1" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
  <script data-require="jquery@*" data-semver="3.1.1" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script data-require="angularjs@1.5.8" data-semver="1.5.8" src="https://opensource.keycdn.com/angularjs/1.5.8/angular.min.js"></script>
  <script data-require="bootstrap@3.1.1" data-semver="3.1.1" src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body class="container" style="padding-top:30px">
  <ul>
      <li ng-controller="ulCtrl"><a ng-href="" class="active">{{customers}}</a></li>
      <li><a ng-href="#JOBS">JOBS</a></li>
      <li><a ng-href="#ESTIMATES">ESTIMATES</a></li>
      <li><a ng-href="#INVOICE">INVOICE</a></li>
      <li class="right"><a ng-href="#ABOUT">ABOUT</a></li>
  </ul>
</body>

</html>

<强>控制器

var app = angular.module("app", []);

app.controller("MyCtrl", function($scope) {
  $scope.image = "media.licdn.com/mpr/mpr/shrink_200_200/…"
});

app.controller("ulCtrl", function($scope) {
  $scope.customers = "CUSTOMERSSS"
});

工作DEMO

更新1

使用demoApp更新了代码,请检查http://plnkr.co/edit/ecYw2lPdLmdOjt9qgWxJ?p=preview