AngularJS：服务生成的控制器中的值为'；不行吗？

HTML:

服务：

angular
.module('app')
.controller('NumCtrl', NumCtrl)

function NumCtrl(mathify) {
    var ctrl = this;

    ctrl.showfactorial = mathify.factorial(ctrl.num);
}

在HTML脚本文件中，服务位于控制器之前。ctrl.num和ctrl.showfactorial都不显示。但是当我在控制器中注释掉showfactorial时，ctrl.num工作正常。我做错了什么

angular
.module('app', [])
.service('mathify', mathify)

function mathify() {

    this.factorial = function(num) {
        if (num === 1) {
            return 1;
        } else {
            return num * this.factorial(num-1);
        }
    }// end of factorial
}

仅当值被分配给控制器的作用域时，才使用html中的值。在上面的示例中，变量在本地声明，但不应用于范围

---

仅当值被分配给控制器的作用域时，才使用html中的值。在上面的示例中，变量在本地声明，但不适用于作用域。您的阶乘函数超过了调用堆栈大小，因为它在初始化时未定义（并且您没有对此进行检查）。此外，阶乘函数仅在控制器初始化时按原样运行

如果希望阶乘结果显示在模板中，则应在更改时设置阶乘，或直接在模板中使用阶乘函数

• 此示例显示直接在模板中使用阶乘函数：
• 此示例显示在更改输入时更新控制器中的显示值：

HTML:

---

您的阶乘函数超出了调用堆栈大小，因为它在初始化时未定义（并且您没有对此进行检查）。此外，阶乘函数仅在控制器初始化时按原样运行

如果希望阶乘结果显示在模板中，则应在更改时设置阶乘，或直接在模板中使用阶乘函数

• 此示例显示直接在模板中使用阶乘函数：
• 此示例显示在更改输入时更新控制器中的显示值：

HTML:

---

在我看来，这是因为ctrl.num未在控制器中初始化。这将导致递归阶乘服务方法超出允许的调用堆栈。您需要考虑空值

function NumCtrl (mathify) {
  var ctrl = this;

  // get the function for use in the template
  ctrl.factorial = mathify.factorial;
}

---

这应该有助于你开始。我使用

$scope.$watch

，在文本框值更改时更新该值。您可能想做一些不同的事情，尽管它看起来很凌乱。

从我看到的情况来看，这是因为您的控制器中没有初始化ctrl.num。这将导致递归阶乘服务方法超出允许的调用堆栈。您需要考虑空值

function NumCtrl (mathify) {
  var ctrl = this;

  // get the function for use in the template
  ctrl.factorial = mathify.factorial;
}

这应该有助于你开始。我使用

$scope.$watch

，在文本框值更改时更新该值。你可能会想做一些不同的事情，尽管看起来很凌乱。

错了！查找“controller as”语法。他做得对，错！查找“controller as”语法。他做得对。

  <div ng-controller="NumCtrl as ctrl">
    <input type="text" id="textbox" ng-model="ctrl.num">
        <h1>{{ctrl.num}}</h1>

        <h3>Factorial</h3>
        <p>{{ctrl.factorial( ctrl.num )}}</p>
  </div>

function NumCtrl (mathify) {
  var ctrl = this;

  // get the function for use in the template
  ctrl.factorial = mathify.factorial;
}

  this.factorial = function(num) {
      if (!num) {
        return 0;
      }
      if (num === 1) {
        return 1;
      } else {
        return num * this.factorial(num - 1);
      }
    } // end of factorial