AngularJS视图控制器_Angularjs_Angularjs Directive

AngularJS视图控制器

angularjs

AngularJS视图控制器,angularjs,angularjs-directive,Angularjs,Angularjs Directive,这是我的第一篇博文，所以对每个人来说都是“你好世界”：）。我的angularJS模块有一个新手风格的问题，无法注意到它在哪里。有谁能看一下我的代码片段并给我一个为什么显示数据不能正常工作的建议吗谢谢你的帮助 <!DOCTYPE html> <html> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"> var one = angular.mo

这是我的第一篇博文，所以对每个人来说都是“你好世界”：）。我的angularJS模块有一个新手风格的问题，无法注意到它在哪里。有谁能看一下我的代码片段并给我一个为什么显示数据不能正常工作的建议吗

谢谢你的帮助

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js">
var one = angular.module('realSimpleCalc', []);
one.controller('calcContr', function ($scope) {
    $scope.score = function () {
        if ($scope.condition == '+') {
            return ($scope.firstDigit + $scope.secondDigit);
        }
        else if ($scope.condition == "-") {
            return (+$scope.firstDigit - +$scope.secondDigit);
        }
            else if ($scope.condition == '*') {
                return $scope.firstDigit * $scope.secondDigit;
            }
            else if ($scope.condition == '/') {
                return ($scope.firstDigit / $scope.secondDigit);
            }
        else if ($scope.condition == '%') {
                return $scope.firstDigit % $scope.secondDigit;
            }
        };
    });
</script>
<body>

<div ng-app = "realSimpleCalc" ng-controller = "calcContr">
    <input type = "number" ng-model = "firstDigit" required/>
    <select ng-model = "condition">
        <option>+</option>
        <option>-</option>
        <option>*</option>
        <option>/</option>
        <option>%</option>
    </select>

    <input type = "number" ng-model = "secondDigit"/>
    <label>=</label>
    <input type = "text" ng-bind = "score"/>

</div >

</body>
</html>


var one=angular.module（'realSimpleCalc'，[]）；
一个控制器（'calcContr'，函数（$scope）{
$scope.score=函数（）{
如果（$scope.condition=='+'））{
返回（$scope.firstDigit+$scope.secondDigit）；
}
如果（$scope.condition==“-”），则为else{
返回（+$scope.firstDigit-+$scope.secondDigit）；
}
如果（$scope.condition='*'），则为else{
返回$scope.firstDigit*$scope.secondDigit；
}
else if（$scope.condition=='/'））{
返回（$scope.firstDigit/$scope.secondDigit）；
}
else if（$scope.condition=='%'））{
返回$scope.firstDigit%$scope.secondDigit；
}
};
});
+
-
*
/
%
=

您应该尝试将脚本放在正文的末尾。

我将您的脚本标记分为两个单独的脚本标记，它似乎解决了您的问题

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<script>
    var one = angular.module('realSimpleCalc', []);
    one.controller('calcContr', function ($scope) {
        $scope.text = "test text";
        $scope.score = function () {
            if ($scope.condition == '+') {
                return ($scope.firstDigit + $scope.secondDigit);
            }
            else if ($scope.condition == "-") {
                return (+$scope.firstDigit - +$scope.secondDigit);
            }
                else if ($scope.condition == '*') {
                    return $scope.firstDigit * $scope.secondDigit;
                }
                else if ($scope.condition == '/') {
                    return ($scope.firstDigit / $scope.secondDigit);
                }
            else if ($scope.condition == '%') {
                    return $scope.firstDigit % $scope.secondDigit;
                }
            };
        });   
</script>
</head>
<body>
<div ng-app="realSimpleCalc" ng-controller="calcContr">
<input type="number" ng-model="firstDigit" required/>
<select ng-model="condition">
    <option>+</option>
    <option>-</option>
    <option>*</option>
    <option>/</option>
    <option>%</option>
</select>

<input type = "number" ng-model = "secondDigit"/>
<label>=</label>
<input type = "text" ng-bind = "score"/>
<p>{{text}}</p>
</div >

</body>
</html>


var one=angular.module（'realSimpleCalc'，[]）；
一个控制器（'calcContr'，函数（$scope）{
$scope.text=“测试文本”；
$scope.score=函数（）{
如果（$scope.condition=='+'））{
返回（$scope.firstDigit+$scope.secondDigit）；
}
如果（$scope.condition==“-”），则为else{
返回（+$scope.firstDigit-+$scope.secondDigit）；
}
如果（$scope.condition='*'），则为else{
返回$scope.firstDigit*$scope.secondDigit；
}
else if（$scope.condition=='/'））{
返回（$scope.firstDigit/$scope.secondDigit）；
}
else if（$scope.condition=='%'））{
返回$scope.firstDigit%$scope.secondDigit；
}
};
});   
+
-
*
/
%
=
{{text}}

绑定函数的问题您必须在chnage上调用score（）函数或单击事件

像

<input type = "number" ng-model = "firstDigit" required/>
    <select ng-model = "condition">
        <option>+</option>
        <option>-</option>
        <option>*</option>
        <option>/</option>
        <option>%</option>
    </select>

    <input type = "number" ng-model ="secondDigit"/>
    <a ng-click=score()>=/a>
    {{total}}


+
-
*
/
%