<body ng-controller="myCtrl">
<input type="checkbox" ng-model="loaded"/>
<select ng-model="list">
<option ng-repeat="option in data.availableOptions" value="{{option.name}}">{{option.id}}</option>
</select>
{{list}}
<button ng-click="addtext()">Button</button>
<div id="container">
<img id="profile" ng-src="{{list}}" ng-show="loaded"/>
</div>
这是我的 html。当我从下拉列表中选择图像时，我想为图像外观设置动画(淡出旧图像并淡入新图像)。如何以 Angular 实现这一目标。
最佳答案
您可以不使用 ng-model，而是使用 ng-change，并指向 Controller 作用域中的一个函数。例如(示例使用 jQuery):
<select ng-change="changePic()">
---------
$scope.changePic = function() {
$('img#profile').fadeOut(500,
function() {
$scope.list = $('select').val();
$('img#profile').fadeIn(500);
}
);
}
我没有测试这个，可能行不通。
关于javascript - 通过下拉选择器angularjs更改动画图像，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34192457/