Javascript Angularjs双向数据绑定不工作$手表不走'；也不行

作为一名新的angular开发者，我学习了一些教程，构建了一些独立的或基于Fire的angular practice应用程序，并认为我已经掌握了这个框架。我想启动一个与服务器和数据库配套的真正应用程序，所以我在github上找到了一个由laravel供电的angular堆栈：

长话短说，这个堆栈为angular控制器生成的代码对于我见过的任何angular控制器来说都是完全陌生的：

class CreateStringFormController{
    constructor(){
        'ngInject';
        //
    }
}

我补充说

class CreateStringFormController{
    constructor($scope){
        'ngInject';
        $scope.string = 'test';
        $scope.stringed = $scope.string+'ed';

        //
    }
}

和我的模板：

<textarea rows="4" columns="50" class="form-control">{{string}}</textarea>
<h3>Parsed string: <span>{{stringed}}</span></h3>

<textarea rows="4" columns="50" class="form-control" ng-model="string"></textarea>

<textarea rows="4" columns="50" class="form-control" ng-model="string"></textarea>
<h3>Parsed string: <span ng-bind="stringed(string)"></span></h3>

{{string}
已分析的字符串：{{stringed}

这里的想法是，当您在文本区域中键入时，它下面的h3会输出textarea+'ed'的值，但数据绑定不起作用。在页面加载中，变量被设置为“test”和“tested”，但键入不会更新{{stringed}的值。即使我放弃了控制器中的所有内容，只是将textarea和h3放在同一个{{string}}上，它也不起作用

如果我将内容包装在$scope.$watch中，则会出现“$digest ready running”错误。如果有人能给我指出正确的方向，那就太棒了。另外，如果有人能解释为什么这个堆栈像所有angularjs教程一样使用构造函数而不是app.controller（），并使用几十个导出/导入，那将是锦上添花

PS文件是.js，不是.ts，我不知道什么是typescript，但这在我的谷歌搜索中出现了很多

---

希望我的问题不要太复杂！谢谢

好的，在模板中尝试以下操作：

<textarea rows="4" columns="50" class="form-control">{{string}}</textarea>
<h3>Parsed string: <span>{{stringed}}</span></h3>

<textarea rows="4" columns="50" class="form-control" ng-model="string"></textarea>

<textarea rows="4" columns="50" class="form-control" ng-model="string"></textarea>
<h3>Parsed string: <span ng-bind="stringed(string)"></span></h3>

您的

解析字符串：

---

使用

{{string}}

&

{{stringed}}

将其显示为值，实际上并不将其绑定。

将

字符串

分配给

stringed

变量只会在第一次工作。更新变量后，

string

将不会更新

stringed

变量的值。因为它们是基元类型变量。只有在引用类型变量（如对象）的情况下，您才可能尝试执行此操作

如果您担心在UI上显示anl值。您不需要为它设置单独的变量（尽管它不会像您希望的那样工作，因为它是基元类型）

请直接在视图上绑定它

<h3>Parsed string: <span ng-bind="string+ 'ed'"></span></h3>

解析字符串：

以下是我如何让它工作的：

    $scope.string = 'whit';
    $scope.stringed = function(input){
        return input+'ed';
    }

然后在模板中：

<textarea rows="4" columns="50" class="form-control">{{string}}</textarea>
<h3>Parsed string: <span>{{stringed}}</span></h3>

<textarea rows="4" columns="50" class="form-control" ng-model="string"></textarea>

<textarea rows="4" columns="50" class="form-control" ng-model="string"></textarea>
<h3>Parsed string: <span ng-bind="stringed(string)"></span></h3>

已解析字符串：

---

因此，我做了一个返回我的值的函数所需的逻辑，把它放在$scope上（有人知道正确的词汇吗？），然后，正如Pankaj Parkar所说的，用ng bind将新函数绑定到span元素，并传入$scope.string，它成功了

Ng模型适用于文本区域，就像它应该的那样，但不适用于跨度，也适用于预期行为。Ng bind会在pageload上正确设置变量，但在数据绑定上没有骰子。您是否尝试过在CreateStringFormController的末尾添加$scope.$apply（）？@hamncheez您能看看我的答案吗？因此，虽然这在这个实例中可行，但这不是我需要的；我需要一个相当复杂的函数，太复杂了，不能放在ng绑定中。然而，这让我非常接近我找到的解决方案。我在控制器中的$scope上创建一个函数，返回我想要的值，然后将该函数绑定到，传入$scope.string，它就工作了！