控制器内的ng-click功能不起作用

Question

I'm trying to make a three tab app using routeProvider ng-view and 3 controllers. 我正在尝试使用routeProvider ng-view和3个控制器创建一个三选项卡应用程序。 I've made one main HTML page and 3 tab HTML pages. 我制作了一个主HTML页面和3个标签HTML页面。 Switching tabs works OK and I can access variables inside tab one; 切换标签工作正常，我可以访问标签1中的变量; however, I cant access the functions declared inside the controller. 但是，我无法访问控制器内声明的函数。 Where is the problem? 问题出在哪儿？

<!doctype html>
<html ng-app="project">
<head>
    <meta charset="utf-8">
    <title>Tabs</title>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
    <link href="css/bootstrap-responsive.css" rel="stylesheet">
    <link href="css/app.css" rel="stylesheet">
    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="lib/angular/angular.js"></script>
    <script src="js/tbb.js"></script>


</head><body>


<div class="tabtable">
    <ul class="nav nav-tabs">
        <li class="active">
            <a href="#/tab1" data-toggle="tab">Tab1</a>
        </li>
        <li>
            <a href="#/tab2" data-toggle="tab">Tab2</a>
        </li>
        <li>
            <a href="#/tab3" data-toggle="tab">Tab3</a>
        </li>
    </ul>
    <div class="tab-content">
        <div class="tab-content">
            <!--tabs content-->
            <div ng-view>

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

This is the JavaScript code: 这是JavaScript代码：

angular.module('project',[]).
    config(function($routeProvider) {
        $routeProvider.
            when('/', {controller:Ctrl1, templateUrl:'tbb_1.html'}).
            when('/tab1', {controller:Ctrl1, templateUrl:'tbb_1.html'}).
            when('/tab2', {controller:Ctrl2, templateUrl:'tbb_2.html'}).
            when('/tab3', {controller:Ctrl3, templateUrl:'tbb_3.html'}).
            otherwise({redirectTo:'/'});
    })
    .run( function($rootScope, $location) {

        $rootScope.var1=1;
        //alert($rootScope.var1);
        // register listener to watch route changes
        $rootScope.$on( "$routeChangeStart", function(event, next, current) {
                //alert('change');



        });
    });



function Ctrl1($scope,$rootScope) {

$scope.var2=$rootScope.var1;

function dodo1(){
    alert('23');
}

$rootScope.$on('$routeChangeStart', function(event, next, current) {
        //alert('change inside ctrl');
    //alert(form.supervisor.$dirty);
    });

}

function Ctrl2($scope,$rootScope) {
}

function Ctrl3($scope,$rootScope) {
}

tbb_1.html tbb_1.html

<h2>tab1</h2>
{{2+2}}<br>
|{{var1}}|<br>
|{{form.var1.$dirty}}|
<a href="" ng-click="var1=8;">property</a>
<a href="" ng-click="dodo1();">dodo</a>
<button class="btn btn-mini" ng-click="dodo1()">buu</button>
<form class="form-horizontal" novalidate name="form" ng-submit="submit()">
    <fieldset>
    <input id="var1" name="var1" placeholder="" class="input"
               type="text" ng-model="var1">
    </fieldset>
</form>

Why does clicking dodo and the button do nothing? 为什么点击渡渡鸟和按钮什么都不做？

Answer 1

Just attach your dodo1 method to the $scope , like this: 只需将dodo1方法附加到$scope ，如下所示：

$scope.dodo1 = function(){
    alert('23');
}

Working plnkr: http://plnkr.co/edit/glyGT6?p=preview 工作plnkr： http ：//plnkr.co/edit/glyGT6？p = preview

Otherwise it will be scope' "private" function. 否则它将是范围''私人'功能。

控制器内的ng-click功能不起作用

问题描述

1 个解决方案

解决方案1
3 已采纳 2013-10-17 19:50:57

控制器内的ng-click功能不起作用

问题描述

1 个解决方案

解决方案1 3 已采纳 2013-10-17 19:50:57

解决方案1
3 已采纳 2013-10-17 19:50:57