Angularjs.从AngularJS控制器访问属性

发布时间：2020-12-17 17:30:54 所属栏目：安全来源：网络整理

导读：我试图用控制器访问图像src来保存它,但无法弄清楚如何做到这一点. 我的模板： img data-ng-model="book.image" style="width: 300px; height: 200px;" ng-src="data:image/png;base64,iVBORw0K...SuQmCC" a data-ng-click="save(book)" class="btn"Submit/a

我试图用控制器访问图像src来保存它,但无法弄清楚如何做到这一点.

我的模板：

<img data-ng-model="book.image"
         style="width: 300px; height: 200px;"
         ng-src="data:image/png;base64,iVBORw0K...SuQmCC">
    <a data-ng-click="save(book)" class="btn">Submit</a>

我的控制器：

controller('BookEditController',[ '$scope','$meteor',function ($scope,$meteor) {
        $scope.save = function (book) {
            if (typeof book == 'object') {
                var books = $meteor("books");
                var id = books.insert(book);
            }
        };
    }])

解决方法

一个选项是使用 directive并将一个名为save的方法应用于它,它将处理图像标记上的src属性.
JS

var app = angular.module('myApp',[]);
app.directive('saveImage',function () {
    return {
        transclude: true,link: function (s,e,a,c) {
            s.save=function(){
                alert(a.src);
            };
         }
    };
});

HTML

<div >
    <img save-image style="width: 300px; height: 200px;" src="http://placehold.it/350x150"> <a ng-click="save()" class="btn">Submit</a>

</div>

This is the code implemented in jsfiddle.

另一种选择是将示波器隔离到控制器,但仍然将图像应用于它而不是函数.

var app = angular.module('myApp',c) {
            s.image = a.src;

        }
    };
});

function cntl($scope) {
    $scope.save = function (img) {
        alert($scope.image || 'no image');
    }
}

HTML

<div ng-controller='cntl'>
    <img save-image style="width: 300px; height: 200px;" src="http://placehold.it/350x150"> <a ng-click="save()" class="btn">Submit</a>

</div>

注意添加的ng-controller =“cntl”.

This is the JSfiddle for that one.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!