angularjs 中的 ng-show 不适用于 span
ng-show in angularjs not working on span
我在 Angularjs 中遇到了 ng-show 的问题。我有一个文本框,用户可以在其中输入服务器的主机名。输入此信息后,服务器的主机名将发送到后端系统,以验证服务器是否存在。我目前使用 bootstrap、font awesome 和 angularjs 在我的文本框中显示加载图标。当我收到来自服务器的响应时,我将 isLoaded 变量更改为 true,我希望加载图标停止显示。但是,这不会发生。无论图标最初设置为何种状态,之后都不会改变。
这是我的问题的简化版本。 Plunker Link Here
HTML
<form>
<div class="form-group has-feedback">
<label for="server">Server:</label>
<input type="text" id="server" class="form-control" placeholder="server host name">
<span ng-show="{{testVm.state}}" class="fa fa-spinner fa-spin form-control-feedback" aria-hidden="true"></span>
<button class="btn btn-primary" ng-click="testVm.turnOn()">Activate</button>
<button class="btn btn-primary" ng-click="testVm.turnOff()">Deactivate</button>
</div>
</form>
Angular代码:
angular
.module('test',[])
.controller('TestController',TestController);
function TestController() {
var testVm = this;
testVm.turnOn = turnOn;
testVm.turnOff = turnOff;
testVm.state = false;
function turnOn() {
testVm.state = true;
}
function turnOff() {
testVm.state = false;
}
感谢任何帮助。谢谢
您使用 ng-show
的方式不对。您不需要双花括号,因为您没有计算变量的字符串值。
<span ng-show="testVm.state" class="fa fa-spinner fa-spin form-control-feedback" aria-hidden="true"></span>
我在 Angularjs 中遇到了 ng-show 的问题。我有一个文本框,用户可以在其中输入服务器的主机名。输入此信息后,服务器的主机名将发送到后端系统,以验证服务器是否存在。我目前使用 bootstrap、font awesome 和 angularjs 在我的文本框中显示加载图标。当我收到来自服务器的响应时,我将 isLoaded 变量更改为 true,我希望加载图标停止显示。但是,这不会发生。无论图标最初设置为何种状态,之后都不会改变。
这是我的问题的简化版本。 Plunker Link Here
HTML
<form>
<div class="form-group has-feedback">
<label for="server">Server:</label>
<input type="text" id="server" class="form-control" placeholder="server host name">
<span ng-show="{{testVm.state}}" class="fa fa-spinner fa-spin form-control-feedback" aria-hidden="true"></span>
<button class="btn btn-primary" ng-click="testVm.turnOn()">Activate</button>
<button class="btn btn-primary" ng-click="testVm.turnOff()">Deactivate</button>
</div>
</form>
Angular代码:
angular
.module('test',[])
.controller('TestController',TestController);
function TestController() {
var testVm = this;
testVm.turnOn = turnOn;
testVm.turnOff = turnOff;
testVm.state = false;
function turnOn() {
testVm.state = true;
}
function turnOff() {
testVm.state = false;
}
感谢任何帮助。谢谢
您使用 ng-show
的方式不对。您不需要双花括号,因为您没有计算变量的字符串值。
<span ng-show="testVm.state" class="fa fa-spinner fa-spin form-control-feedback" aria-hidden="true"></span>