web-dev-qa-db-ja.com

ng-click angular.jsでボタンIDを渡す

Ionic FrameworkでボタンIDを渡す必要があります。

これが私が試したことです。

jsコードの場合：

angular.module('todo', ['ionic'])
.controller('TodoCtrl', function($scope) {
    {
        $scope.showAlert = function(btnId) {
            alert(btnId);
        };
    }
});

html：

<button id="a" class="button button-light"  data="{{button.id}}" ng-click="showAlert(data.id)">
    Click Me
</button>

O/P：undefined

または

<button id="a" class="button button-light"  data="{{button.id}}" ng-click="showAlert(data)">
    Click Me
</button>

O/P：undefined

または

<button id="a" class="button button-light"  data="{{event.id}}" ng-click="showAlert(data.id)">
    Click Me
</button>

O/P：undefined

または

<button id="a" class="button button-light" ng-click="showAlert(this.id)">
    Click Me
</button>

O/P：undefined

または

<button id="btnId" class="button button-light" ng-click="showAlert('btnId')">
    Click Me
</button>

O/P：btnId

関数にボタンのIDを直接書き込む正しい方法ですか？

this のようないくつかの回答を参照しました。だから、私はそれを使用する際にいくつかの間違いを犯していると思います。変更する必要があるものを教えてください。

angularjsangularjs-ng-clickionic-framework
12
user2185272

ヨ、この要点を確認してください：

https://Gist.github.com/lc-nyovchev/ed0a640a82a0f2dfd5a1

それは非常に簡単で素朴な方法です。

<div data-ng-init="btnId='asd';">
    <button data-ng-attr-id="btnId" class="button button-light" data-ng-click="showAlert(btnId)">
        Click Me
    </button>
</div>

または、コントローラーに含めることができます：

$scope.btnId = 'asd';

その場合、ng-initブロックdivは必要ありません。

または、ng-clickで$ eventのハンドルを取得し、そのターゲットを取得してからそのidを取得できますが、お勧めしませんが、angularの方法ではありません物事の：

<button id="bla" class="button button-light" data-ng-click="showAlert($event)">
    Click Me
</button>


$scope.showAlert = function(event){
    alert(event.target.id);
}
41
Nikola Yovchev

これは、リピーターが存在しない場合に機能します。リピーターがデータ属性である場合、別の名前を付ける必要があり、次にevent.CurrentTarget.Idが機能します。

3
Kushal M K