javascript - Controller 的功能在 Angular JS 中不起作用

标签 javascript angularjs html

按钮代码是

<div class="btn-group" align="center">
    <button ng-click="myFunction()" id="one" class='btn btn-primary btn1' >Save Entry</button>
    <button ng-click="close_window()" id="two" class='btn btn-primary btn2'>Exit</button>
</div>

新 Controller 是

var app=angular.module('userApp',[])
    app.ng-controller('userController', function($scope)){
        $scope.myFunction = function(){
            var change= document.getElementById("one")
            if (change.innerHTML == "Save Entry")
            {
                change.innerHTML = "Saved!";
            }
            else 
            {
                change.innerHTML = "Save Entry";
            }
            return
        }

        $scope.close_window = function() {
            if (confirm("Close Window?")) {
                window.close();
            }      
        }
    }

如果我没有添加任何 Controller 并且只是声明函数,那么下面的代码工作正常

function myFunction(){
    var change= document.getElementById("one")
    if (change.innerHTML == "Save Entry")
    {
        change.innerHTML = "Saved!";
    }
    else 
    {
        change.innerHTML = "Save Entry";
    }
}

function close_window() {
    if (confirm("Close Window?")) {
    close();
}

但是当我添加 Controller 时,按钮将停止工作。我尝试了有关堆栈溢出的每个函数定义和答案,但似乎没有任何功能正常工作。我如何像以前那样在 Controller 内实现按钮的工作?

最佳答案

var app=angular.module('userApp',[])
    app.controller('userController', function($scope){
        $scope.myFunction = function(){
            var change= document.getElementById("one")
            if (change.innerHTML == "Save Entry")
            {
                change.innerHTML = "Saved!";
            }
            else 
            {
                change.innerHTML = "Save Entry";
            }
            return
        }

        $scope.close_window = function() {
            if (confirm("Close Window?")) {
                window.close();
            }      
        }
    });
<DOCTYPE html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body ng-app="userApp" ng-controller="userController">
<div class="btn-group" align="center">
    <button ng-click="myFunction()" id="one" class='btn btn-primary btn1' >Save Entry</button>
    <button ng-click="close_window()" id="two" class='btn btn-primary btn2'>Exit</button>
</div>
</body>

你正在使用app.ng-controller它应该是app.controllerng-controller是一个指令,用于定义 Controller 可见。

app.controller('userController', function($scope){
    .......
})

关于javascript - Controller 的功能在 Angular JS 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45838608/

相关文章:

javascript - 按下鼠标键时保持缩放(或缩小)

javascript - 从 Controller 传递的变量的默认值, Angular 文本框中的 ng-init 未显示

javascript - angularjs选择框默认选择基于数据库id

JQuery 输入动态检查

javascript - 如何从谷歌浏览器启用本地文件系统读写访问?

javascript - 有没有办法使用react-leaflet添加MultiPolyline组件?

javascript - JQuery 可排序嵌套可排序 div

javascript - 未捕获的 TypeError : closeBtn. addEventListener 不是 script.js:8 处的函数

javascript - Angular ng-click 不触发

javascript - 提供下载 pdf 或在浏览器中打开的选项