Angular js - 从 ng-admin 中的视图调用控制器内的函数

Question

我正在使用 ng-admin 的多语言功能。在文件 header.html 中，我添加了一个包含语言列表的下拉菜单。单击每个选项都会触发一个函数调用。

函数本身在 /js/main.js

的控制器中

单击任何一种语言都会导致 ReferenceError: serve_language 未定义.

这是两个文件的内容：

header.html

<ul class="nav navbar-top-links navbar-right hidden-xs">
    <li uib-dropdown ng-controller="languageCtrl">
        <a uib-dropdown-toggle href="#" aria-expanded="true">
            <i class="fa fa-user fa-lg"></i>&nbsp; Language&nbsp;<i class="fa fa-caret-down"></i>
        </a>
        <ul class="dropdown-menu dropdown-user" role="menu">
            <li><a href="#" onclick="serve_language('en')"><i class="fa fa-sign-out fa-fw"></i> English</a></li>
            <li><a href="#" onclick="serve_language('ge')"><i class="fa fa-sign-out fa-fw"></i> German</a></li>
            <li><a href="#" onclick="serve_language('fr')"><i class="fa fa-sign-out fa-fw"></i> French</a></li>
            <li><a href="#" onclick="serve_language('sp')"><i class="fa fa-sign-out fa-fw"></i> Spanish</a></li>
        </ul>
    </li>
</ul>

main.js

'use strict'
var myApp = angular.module('myApp', ['ng-admin','ng-admin.jwt-auth', 'nvd3']);
myApp.controller('languageCtrl', ['$translate', '$scope', function ($translate, $scope) {
    $scope.serve_language = function (langKey) {
       console.log("@langctrl"); 
    };
}]);

我也尝试将函数调用为 languageCtrl.serve_language()，但这导致了 ReferenceError: languageCtrl is not defined

Answer 1

您应该将 onclick 更改为 ng-click

<ul class="dropdown-menu dropdown-user" role="menu">
            <li><a ng-click="serve_language('en')"><i class="fa fa-sign-out fa-fw"></i> English</a></li>
            <li><a ng-click="serve_language('ge')"><i class="fa fa-sign-out fa-fw"></i> German</a></li>
            <li><a ng-click="serve_language('fr')"><i class="fa fa-sign-out fa-fw"></i> French</a></li>
            <li><a ng-click="serve_language('sp')"><i class="fa fa-sign-out fa-fw"></i> Spanish</a></li>
        </ul>

Answer 2

不要使用 href="#" 和 ng-click 否则它会重定向到您的默认路由（如果添加了路由）。

使用 ng-click 代替 onclick。

Answer 3

使用ng-click因为angularjs不支持onclick

Angular js - 从 ng-admin 中的视图调用控制器内的函数

Angular js - Call function inside controller from view in ng-admin

controller

angularjs

ng-admin