4

コントローラーで画像の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);
            }
        };
    }])
4

2 に答える 2

5

1 つのオプションは、ディレクティブを使用して、イメージ タグで見つかったsrc属性を処理する save と呼ばれるメソッドをそれに適用することです。
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>

これは、jsfiddle で実装されたコードです。

もう 1 つのオプションは、スコープをコントローラーに分離しますが、関数の代わりにイメージをコントローラーに適用することです。

JS

var app = angular.module('myApp', []);
app.directive('saveImage', function () {
    return {
        transclude: true,
        link: function (s, e, a, 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" に注意してください。

これはそのための JSfiddle です。

于 2013-06-13T19:20:13.687 に答える