在 HTML 中将默认值设置为 ng-bind答案

【问题标题】：Set Default Value to ng-bind in HTML在 HTML 中将默认值设置为 ng-bind
【发布时间】：2014-09-11 14:42:42
【问题描述】：

我想为范围设置一个默认值，由 ng-bind 获取。我这样做是这样的：

<button>Show <span data-ng-bind="data.text" data-ng-init="data.text = 'All';"></span> Names</button>

在此示例中，页面加载时跨度设置为 innerHTML = 'All'。

但是，我希望有一种方法可以在不需要使用 ng-init 的情况下做到这一点，可能类似于：

<button>Show <span data-ng-bind="data.text = 'All';"></span> Names</button>

【问题讨论】：

【解决方案1】：

|| 运算符也可以在 ngBind 中工作，就像在纯 JavaScript 中一样：

<span ng-bind="myVariable || 'My default value'"></span>

如果变量被填充，则输出myVariable，否则使用替代'My default value'。

【讨论】：

【解决方案2】：

在您的控制器中：

$scope.data = {};
$scope.data.text = "All";

您的标记：

<button>Show <span data-ng-bind="data.text"></span> Names</button>

或者，如果您想跳过控制器代码（感谢 Kohjah Breese 的评论）：

    <button>Show <span data-ng-bind="data.text || 'All'"></span> Names</button>

大概在你的控制器的其他地方会有一些代码可以切换这个值，但为了初始化，应该这样做。

编辑：或者，正如 tymeJV 在 cmets 中指出的那样（添加了 ng-cloak，因此 {{}} 语法不会向用户显示）：

<button>Show <span ng-cloak>{{data.text || "All"}}</span> Names</button>

【讨论】：

这也有效，我正在寻找的那种东西：
对于它的价值，codeschool.com 的入门课程（非常好，而且我没有得到报酬，等等）使用 this 而不是 $scope，但我我猜这是相当标准的做法。也许他们会在下一级课程中使用它

【解决方案3】：

来自angularjs doc：

ngInit 唯一合适的用途是为 ngRepeat 的特殊属性设置别名 [...] 除了这种情况，您应该使用控制器而不是 ngInit 来初始化作用域上的值。

所以我猜想在你的控制器中初始化 data.text 对 angularjs 来说很好

【讨论】：