Angularjs ng click事件未在span元素上触发_Angularjs

Angularjs ng click事件未在span元素上触发

angularjs

Angularjs ng click事件未在span元素上触发,angularjs,Angularjs,为什么ng click在下面的代码中不起作用？它应该很简单。我错过了什么。谢谢（函数（）{ "严格使用",； //设置应用程序。 var mainApp=angular.module（'mainApp'，[]）； //创建一个控制器。 mainApp.controller（'navController'，['$scope'，'$log'，函数（$scope，$log）{ //$scope.firstName=“John”； //$scope.lastName=“Doe”；， $scope

为什么ng click在下面的代码中不起作用？它应该很简单。我错过了什么。谢谢

（函数（）{
"严格使用",；
//设置应用程序。
var mainApp=angular.module（'mainApp'，[]）；
//创建一个控制器。
mainApp.controller（'navController'，['$scope'，'$log'，函数（$scope，$log）{
//$scope.firstName=“John”；
//$scope.lastName=“Doe”；，
$scope.openTab=函数（tabNumber）{
$log.log（tabNumber）；
};
var s=1；
}]);
}());

表1
表2
表3
使用controllerAs
时，必须将变量和方法直接绑定到控制器实例this
，而不是$scope

// this.firstName = "John";
// this.lastName = "Doe";
this.openTab = function (tabNumber) {
    $log.log(tabNumber);
};

因为controllerAs
将控制器函数中的控制器实例this
设置为$scope.nc
您在控制器中使用的是$scope
，但在视图中您使用的是as

如果您非常想将用作
，那么控制器中的方法应该使用这个
关键字
像这样
this.openTab = function (tabNumber) {
    $log.log(tabNumber);
};

但是如果您想使用控制器作用域，那么您的视图应该是
<span ng-click="openTab(1)" class="btn"> tab 1</span>
<span ng-click="openTab(2)" class="btn"> tab 2</span>
<span ng-click="openTab(3)" class="btn"> tab 3</span>

选项卡1
表2
表3
请尝试此
    (function() {
    'use strict';
    // Set up the app.
    var mainApp = angular.module('mainApp', []);

    // Create a controller.
    mainApp.controller('navController', ['$scope', '$log' ,function($scope, $log) {
        //$scope.firstName= "John";
        //$scope.lastName= "Doe";,
        $scope.openTab = function (tabNumber) {
            $log.log(tabNumber);
        };

        var s =1;
    }]);
    }());


<!DOCTYPE html>
<html>
    <head>
        <script src="/js/angular.js"></script>
        <script src="/js/app/app.js"></script>

        <link rel="stylesheet" href="/css/styles.css" />

    </head>
    <body ng-app="mainApp">
        <div class="navigation" ng-controller="navController">
            <!--<p>Name: <input type="text" ng-model="name"></p>
            <p ng-bind="name"></p>
            <p>{{name}}</p>
            -->
            <span ng-click="openTab(1)" class="btn"> tab 1</span>
            <span ng-click="openTab(2)" class="btn"> tab 2</span>
            <span ng-click="openTab(3)" class="btn"> tab 3</span>
        </div>
    </body>
</html>

（函数（）{
"严格使用",；
//设置应用程序。
var mainApp=angular.module（'mainApp'，[]）；
//创建一个控制器。
mainApp.controller（'navController'，['$scope'，'$log'，函数（$scope，$log）{
//$scope.firstName=“John”；
//$scope.lastName=“Doe”；，
$scope.openTab=函数（tabNumber）{
$log.log（tabNumber）；
};
var s=1；
}]);
}());
表1
表2
表3
我意识到这是一个老生常谈的答案，但如果您不解释您为解决问题所做的工作，请不要期望人们注意。