問題タブ [angularjs-controlleras]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
angularjs - controllerAs-Syntax を使用したコールバックでのこの参照
私はangularjsプロジェクトに取り組んでおり、angularjs 2にできるだけ近づけて実装しようとしています.
angularjs 2 では ng-controller と $scope がなくなるため、ng-controller の代わりにディレクティブを使用しています。また、controllerAs-syntax を使用して $scope の使用を回避しようとしています。
私のディレクティブは次のようになります。
これまでのところ、すべて正常に動作しています。コールバック関数内でコントローラーのメソッドまたはプロパティを呼び出そうとすると、問題が発生します。この場合、'this' は実際のコントローラ インスタンスを参照していません。
例:
コールバック内でコントローラのメソッドとプロパティを使用できるように、コールバック内でコントローラ インスタンスへの参照を取得する方法はありますか?
javascript - Angularjs - $scope と controllerAs を使用せずに親コントローラーにアクセスする
$scope を注入することなく、コントローラーの親スコープにアクセスする方法が必要でした。この背後にある理由は、私が SPA を構築していて、現在のページに応じて body 要素にクラスを適用したかったからです。クラスを変更するためだけに、すべてのコントローラーに $scope を注入する必要はありません。また、$routeprovider やサービスを使用してこの機能をカプセル化する方法があれば、これを間違った方法で見ている場合はお知らせください。最近Angularを使い始めたばかりなので、解決策が本当に簡単な場合は事前にお詫び申し上げますが、グーグルで私の状況に似たものを見つけることができませんでした.
基本的なセットアップは次のとおりです。
index.html
body.controller.js
contact.controller.js
app.routes.js
html - angularJSの「コントローラーとして」構文でngRouteを使用する
私は次のものを持っていconfig
ますcontrollers
私の問題は、で使用するときに発生しますindex.html
。
を使っていないので$scope
、書くだけで{{pageClass}}
はうまくいきません。を使用してこれを回避するにはどうすればよいcontroller as syntax
ですか?
編集
私はいくつかの良い答えを得ました。controllerAs
値に別の名前を付けたい場合は、これを行う別の方法も発見しました: hctrl
, actor
and ctrl
(上記のコードのように):
htmlでこれを行うことができます:
angularjs - ディレクティブでの ControllerAs の使用
ここでJohn Papa の angularJS スタイル ガイドに従おうとしており、ディレクティブを controllerAs を使用するように切り替え始めています。ただし、これは機能していません。私のテンプレートは、vm に割り当てられたものにアクセスできないようです。動作を示すこの非常に単純な plkr の例を参照してください。
javascript - $scopeなしでControllerAs構文を使用してサービス変数とバインドしますか?
私は AngularJS の controllerAs 構文に慣れてきましたが、サービス変数への単純なバインディングを行う必要があるときに問題が発生しました。通常、$scope.$watch
or$scope.$on
はそうしますが、それには を注入する必要があり$scope
、controllerAs の目的を無効にしているようです。
現在私が持っているのは、ボタンの1つをクリックして を呼び出したconfig.setAttribute(attr)
後、コントローラーはサービスのsetAttribute
関数を呼び出しますが、 は呼び出さないgetAttribute
ため、config.attribute
変更されません。
私がこれにどのように取り組んでいるのか、私が見落としているものはありますか? 代わり$scope
に使用するコントローラー構文を挿入または変更する必要がありますか?$scope
意見:
サービス:
コントローラ:
javascript - AngularJS ControllerAs 構文とコントローラーに挿入された変数
私はディレクティブを書いており、John Papa スタイル ガイドに固執しようとしています。そのため、構文ワゴンにジャンプすることも決定し、ControllerAs
以下のような小さなディレクティブを用意しました。
メルマガ登録サービスです。HTTP リクエストを実行する必要があるため、コントローラーに挿入します。すべて問題ありvm.doSubmit(--formname-here--)
ませんが、テンプレートから関数を呼び出すと、$http
サービスを見つけることができなくなります。
だから私の質問:関数$http
から注入されたものにどのようにアクセスできますか?doSubmit()
編集
ビューコードを含めますが、心配はいりません - 配管は機能します:
編集2
結局のところ、@Tek は正しかった - コードは機能する。私がそれを見なかった理由は、(私が思うに) Chrome の JS ランタイム$http
が呼び出されないことを知っているときに最適化するためだと思います。
このコードは正常に動作します。これは、ランタイムが関数呼び出し$http
での使用を予測したためだと思います。console.log()
ただし、その行を削除すると、次のようになります(そもそもこの問題が発生したのはそのためです):
console.log
-をコメントアウトしたことに注意してdoSubmit()
ください$http
。今$http
、コンソールで呼び出すと、定義されていません。
javascript - AngularJS ng-click機能に達していません
製品リストに新しい製品を追加すると、機能しません。したがって、製品はうまくロードされますが、ng-click
関数は呼び出されません。(関数に入れたアラートaddProduct
は実行されません)。
HTML
どんな助けでもいただければ幸いです。
コントローラー:
angularjs - Angular コントローラの外部で Cordova 固有のイベントを削除するには?
たとえば、ビューの変更を処理するコントローラーがあるとします。
<body>
しかし、たとえば、内部の HTML ボタンだけでなく、デバイスの [戻る] ボタンでも処理したいと考えています。したがって、次のように、イベントのイベント リスナーを追加し、AngularJS コンテキストの外部で呼び出されることをdeviceready
明示的に呼び出す必要があります。$scope.$apply()
しかし、私は (比較的 :)) 新しい構文にも従いたいと思っていcontrollerAs
ます。これは、Todd Motto: Opinionated AngularJS styleguide for teamによって現在推奨されて$scope
いるため$emit
です$on
。$apply()
しかし、ユーザーがデバイスの戻るボタンをクリックしたときに、コンテキストがAngularコンテキストではないため、呼び出す必要がある場合はできません。Service
コードバのラッパー ファサードを作成し、このサービスに注入することを考えました$scope
が、ここで読んだように、 $scope を angular サービス function()に注入することはできません。私はこれを見ました: Angular JS & Phonegap 戻るボタン イベントと受け入れられたソリューションには$apply()
、$scope
取り外し不可。$scope
明示的に必要ないときにコントローラから削除するために、Angular コントローラの外部にある Cordova 固有のイベントを削除する解決策を知っている人はいますか? 前もって感謝します。
javascript - ng-repeat を使用した ng-show angular タブ
私はこれにしばらく取り組んできましたが、なぜうまくいかないのかわかりません。これは私が作成しようとしている効果です - http://plnkr.co/edit/RAeIwFbn2Zoe9WfLdMX8?p=preview。クリックすると別の情報が表示されるタブ バーを作成したいと考えています。
これは私がこれまでに持っているコードですが、何らかの理由で機能しません:
HTML
JS
私のAngularコードは次のようになります。
私はさまざまな回答を読み、多くのことを試しましたが、それは何かばかげているに違いないと感じています。どんな助けでも大歓迎です。
ありがとう、ポール