AngularJS 没有通过 HTML 链接答案

【问题标题】：AngularJS is not linking through HTMLAngularJS 没有通过 HTML 链接
【发布时间】：2021-01-11 08:42:27
【问题描述】：

我已经查看了与此相关的问题，我的代码在上一个问题中的回答是正确的，然后也无法正常工作。它非常简单的初学者代码

<html ng-app="">
<head>
    <title>Assignment</title>
    <script src="‪js/angular.min.js" ></script>
    <style type="text/css">
        .body{
                background-color: red
        }
    </style>
</head>
<body>
    Enter name <input type="text" ng-model="color" name=""><br>
    Name : {{color}}

</body>
</html>

输出：输入名字： _______________ 名称：{{颜色}} 我没有得到试图以颜色存储的值。

【问题讨论】：

ng-app="" 在 angularjs 中已经很久没有得到支持了......您尝试遵循的教程有多大？

标签： javascript html css node.js angularjs

【解决方案1】：

您需要应用正确的代码语法和 html 结构。 - 特别是在ng-app 和ng-controller 中封装代码。

请注意，您可以在用户键入时应用背景颜色 - 这将更改正文的背景颜色 - 但仅当输入的文本与可识别颜色的值匹配时。例如：“red”将使背景变为红色，但如果您删除该 cahracter bey 字符然后输入“blue”，则当单词与定义的颜色不匹配时，背景将为白色 - 例如：red...re。 .. r ...b ..bl... 蓝色... 蓝色。

最好使用.blur() 方法在用户完成输入后更改背景颜色 - 而不是在击键时输入文本。你仍然不能保证一个有效的颜色想法 - 所以最好使用一个选择列表和一组定义的颜色选项。即使那样 - 我会用所需的样式添加一个类并添加/删除该类 - 例如：body.red { background-color: red}; body.blue {背景颜色：蓝色};

有很多方法可以改变背景颜色 - 但这个演示将向您介绍如何设置 angularJS 应用程序以及如何引用 $scope 变量。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport"
     content="width=device-width, initial-scale=1, user-scalable=yes">
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>

  <script>
   angular.module('DemoApp', [])
   .controller('DemoController', ['$scope', function($scope) {
       $scope.color = "red";
   }]);

  </script>

</head>
<body ng-app="DemoApp" ng-controller="DemoController" ng-style="{'background-color': color}">

Enter name <input type="text" ng-model="color" name=""><br/>Name : {{color}}
</body>
</html>

【讨论】：

非常感谢你的朋友，我试过这个代码。它对学习有很大帮助，我也尝试了该在线链接，但也没有用。那是1.8。我不知道它有什么问题。但再次非常感谢你。
很高兴有帮助 - 感谢您接受它 - 祝您的编码好运 :)

【解决方案2】：

在js/前面发现了一些连线字符

<script src="‪js/angular.min.js" ></script>

导致 angularjs 导入失败。

尝试重新输入网址或使用官方cdn。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.0/angular.min.js" ></script>

【讨论】：