为什么在这个 Angular JS 测试中不会执行 ng-change？

我想测试一下 Angular JS 每次修改文本输入时，其对应的模型对象将被打印到控制台的方式。

我得到了这个标记:

它被一个带有ng-controller="datosPersonalesController"属性的div包裹。和一个带有ng-app的外部div。

这是JavaScript:

function datosPersonalesController ($scope) {
    $scope.name = "Paco"
    $scope.datosPersonales = {
        nombre:     "",
        apellidos:  0,
        edad:       0,
        telefono:   "",
        celular:    "",
        mail:       "",
        fb:         "",
        direccion:  ""
    }
    $scope.testAngular = function  () {
        console.log($scope.name)
    }
}

我将JS文件包含在<head>中。

然而，在浏览器上测试，它不会打印任何东西到控制台。我实际上希望模型是$scope.datosPersonales.nombre，但改为名称检查。

我包括这个小提琴，它应该显示在一个<p>，但不工作

在您的示例中，定义控制器的脚本在加载页面时正在运行。Angular在那之前运行，它找不到控制器。更改旁边的下拉菜单，将脚本放在正文中。

现在应该可以工作了…

<div ng-app>
    <div ng-controller="datosPersonalesController">
        <input type="text" class="form-control" id="inputNombre" placeholder="Nombre(s)" ng-model="datosPersonales.nombre" ng-change="testAngular()">
        <p>{{datosPersonales.nombre}}</p>
    </div>
</div>

小提琴

相关内容

最新更新

热门标签：