角度中的 if 和 else if 语句答案

【问题标题】：If and else if statements in angular角度中的 if 和 else if 语句
【发布时间】：2019-05-20 11:43:29
【问题描述】：

我想在 Angularjs 中编写一个代码，它从输入（文本框）中获取一个字符串，并根据 if 和 else if 语句用不同的颜色标记输入。我编写了一个将文本从输入复制到 h1 的代码，并将其标记为红色。如果我写名字“Alex”，它会用黄色标记，任何其他字符串都会用背景红色标记。

<!DOCTYPE html>
<html>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
  <body ng-app="">
    <label>Enter your name:</label>
    <input type = "text" data-ng-model = "name" placeholder = "Insert your name:" />
    <h1 data-ng-if="name" >Hello    
      <span data-ng-style ="{'background-color': name == 'Alex' ? 'yellow' :'red'}"> {{name}}</span> </h1>
    <div data-ng-bind = "name"> </div>
    <button data-ng-click ="name = 'Alex'"> Fill your name</button>
  </body>
</html>

例如，如果我写 Alex，它会将其标记为背景色绿色，如果我写名称 David，它将将其标记为 background-color-green，等等。

海姆

【问题讨论】：

标签： angularjs

【解决方案1】：

为什么不简单地在控制器中添加一个计算背景颜色的函数？

<span data-ng-style ="{'background-color': calculateBackgroundColor(name)}"> {{name}}</span> </h1>

进入你的控制器：

function calculateBackgroundColor(name) {
    switch(name) {
        case 'Alex':
            return 'red';
        default:
            return 'blue';
    }
}

【讨论】：

我几乎不知道什么是控制器。请给我看看好吗？
我不知道该怎么做！我是初学者。