タグ付けされた質問 「angularjs」

私はAngularJSを初めて使用するので、まず、AngularJSだけを使用して新しいアプリケーションを開発しようと思いました。 $httpAngular App を使用して、サーバー側にAJAX呼び出しを行おうとしています。 パラメータを送信するために、私は以下を試しました： $http({ method: "post", url: URL, headers: {'Content-Type': 'application/x-www-form-urlencoded'}, data: $.param({username: $scope.userName, password: $scope.password}) }).success(function(result){ console.log(result); }); これは機能していますが、ではjQueryも使用してい$.paramます。jQueryへの依存を削除するために、私は試しました： data: {username: $scope.userName, password: $scope.password} しかし、これは失敗したようです。それから私は試しましたparams： params: {username: $scope.userName, password: $scope.password} しかし、これも失敗したようです。それから私は試しましたJSON.stringify： data: JSON.stringify({username: $scope.userName, password: $scope.password}) 私の探求に対するこれらの可能な答えを見つけましたが、失敗しました。私は何か間違ったことをしていますか？AngularJSがこの機能を提供すると確信していますが、どうやって？

195 javascript  jquery  angularjs  ajax  angularjs-http 

AngularJSが提供するng-showおよびng-hide関数を使用して、一部のHTMLを表示/非表示にしようとしています。 ドキュメントによると、これらの関数のそれぞれの使用法は次のとおりです。 ngHide – {expression}-式が真である場合、要素はそれぞれ表示または非表示になります。ngShow – {expression}-式が真である場合、要素はそれぞれ表示または非表示になります。 これは、次のユースケースで機能します。 <p ng-hide="true">I'm hidden</p> <p ng-show="true">I'm shown</p> ただし、オブジェクトのパラメーターを式として使用するng-hideと、とにng-showは正しいtrue/ false値が与えられますが、値はブール値として扱われないため、常にreturnを返しfalseます。 ソース <p ng-hide="{{foo.bar}}">I could be shown, or I could be hidden</p> <p ng-show="{{foo.bar}}">I could be shown, or I could be hidden</p> 結果 <p ng-hide="true">I should be hidden but I'm actually shown</p> <p ng-show="true">I should …

193 angularjs  ng-show  ng-hide 

アプリでHTML5モードを有効にしたい。ここに示すように、私は構成のために次のコードを入れました： return app.config(['$routeProvider','$locationProvider', function($routeProvider,$locationProvider) { $locationProvider.html5Mode(true); $locationProvider.hashPrefix = '!'; $routeProvider.when('/', { templateUrl: '/views/index.html', controller: 'indexCtrl' }); $routeProvider.when('/about',{ templateUrl: '/views/about.html', controller: 'AboutCtrl' }); ご覧のとおり、私はを使用し、$locationProvider.html5modeですべてのリンクを変更してng-hrefを除外しました/#/。 問題 現時点でlocalhost:9000/は、インデックスページに移動して確認し、などの他のページに移動できますlocalhost:9000/about。 しかし、localhost:9000/aboutページを更新すると問題が発生します。次の出力が表示されます。Cannot GET /about ネットワーク呼び出しを見ると： Request URL:localhost:9000/about Request Method:GET 一方、最初に移動しlocalhost:9000/、次に移動するボタンをクリックすると、次のようになります/about。 Request URL:http://localhost:9000/views/about.html これはページを完全にレンダリングします。 更新時に角度を有効にして正しいページを取得するにはどうすればよいですか？

193 angularjs  html  angular-routing 

非常によく似た3つのコントローラーがあります。これらの3つを拡張して機能を共有するコントローラーが欲しい。

193 javascript  angularjs  dry 

ng-showなどを使用する以外に、条件付きでコンテンツを表示する方法があるかどうか疑問に思っていました。たとえば、backbone.jsで、次のようなテンプレートのインラインコンテンツで何かを行うことができます。 <% if (myVar === "two") { %> show this<% } %> しかし、角度では、htmlタグで囲まれたものの表示と非表示に制限されているようです <p ng-hide="true">I'm hidden</p> <p ng-show="true">I'm shown</p> コンテンツをhtmlタグでラップするのではなく、{{}}を使用するだけで角度付きでインラインコンテンツを条件付きで表示および非表示にする推奨の方法は何ですか？

192 angularjs  if-statement  ternary-operator 

特定のユースケースでは、単一のフォームを「古い方法」で送信する必要があります。つまり、action = ""のフォームを使用しています。応答はストリーミングされるため、ページを再読み込みしません。典型的なAngularJSアプリはそのようにフォームを送信しないことを私は完全に認識していますが、今のところ他に選択肢はありません。 とはいえ、Angularからいくつかの非表示フィールドを設定しようとしました： <input type="hidden" name="someData" ng-model="data" /> {{data}} データの正しい値が表示されていることに注意してください。 フォームは標準フォームのように見えます： <form id="aaa" name="aaa" action="/reports/aaa.html" method="post"> ... <input type="submit" value="Export" /> </form> [送信]をクリックすると、サーバーに値が送信されません。入力フィールドをタイプ「テキスト」に変更すると、期待どおりに機能します。私の想定では、非表示フィールドは実際には入力されていませんが、テキストフィールドは実際には双方向バインディングのために表示されます。 AngularJSが入力した非表示フィールドを送信する方法はありますか？

192 javascript  forms  angularjs 

私はこの角の世界に慣れていません。二重中かっこ{{}}と単一中かっこ{}の使用と少し混乱しています。 ng-class={expression} normal data binding like{{obj.key}} ng-hide='mydata==="red"'

192 angularjs 

宣言foo内のどこからでも呼び出せるようにするユーティリティ関数がある場合ng-app。モジュール設定でグローバルにアクセスできるようにする方法はありますか、それともすべてのコントローラーのスコープに追加する必要がありますか？

191 angularjs  function  global 

それは以前に尋ねられました、そして答えからそれはよく見えません。このサンプルコードを考慮して尋ねたい... 私のアプリはそれを提供するサービスに現在のアイテムをロードします。アイテムを再ロードせずにアイテムデータを操作するいくつかのコントローラーがあります。 私のコントローラーは、アイテムがまだ設定されていない場合はアイテムを再読み込みします。それ以外の場合は、コントローラー間でサービスから現在読み込まれているアイテムを使用します。 問題：Item.htmlをリロードせずに、コントローラーごとに異なるパスを使用したいと思います。 1）それは可能ですか？ 2）それが不可能な場合、ここで思いついた方法よりもコントローラごとにパスを設定するより良い方法はありますか？ app.js var app = angular.module('myModule', []). config(['$routeProvider', function($routeProvider) { $routeProvider. when('/items', {templateUrl: 'partials/items.html', controller: ItemsCtrl}). when('/items/:itemId/foo', {templateUrl: 'partials/item.html', controller: ItemFooCtrl}). when('/items/:itemId/bar', {templateUrl: 'partials/item.html', controller: ItemBarCtrl}). otherwise({redirectTo: '/items'}); }]); Item.html <!-- Menu --> <a id="fooTab" my-active-directive="view.name" href="#/item/{{item.id}}/foo">Foo</a> <a id="barTab" my-active-directive="view.name" href="#/item/{{item.id}}/bar">Bar</a> <!-- Content --> <div …

191 angularjs 

コントローラーの下で定義された関数をWebページの任意の場所（コントローラーコンポーネントの外部）から呼び出すにはどうすればよいですか？ 「取得」ボタンを押すと完全に動作します。しかし、divコントローラーの外部から呼び出す必要があります。ロジックは次のとおりです。デフォルトでは、私のdivは非表示です。ナビゲーションメニューのどこかでボタンを押すと、divがshow（）され、「get」関数が実行されます。どうすればこれを達成できますか？ 私のウェブページは： <div ng-controller="MyController"> <input type="text" ng-model="data.firstname" required> <input type='text' ng-model="data.lastname" required> <form ng-submit="update()"><input type="submit" value="update"></form> <form ng-submit="get()"><input type="submit" value="get"></form> </div> 私のjs： function MyController($scope) { // default data and structure $scope.data = { "firstname" : "Nicolas", "lastname" : "Cage" }; $scope.get = function() { $.ajax({ url: "/php/get_data.php?", type: "POST", …

190 angularjs 

私はこのようなルート設定をしています： var myApp = angular.module('myApp', []). config(['$routeProvider', function ($routeProvider) { $routeProvider. when('/landing', { templateUrl: '/landing-partial', controller: landingController }). when('/:wkspId/query', { templateUrl: '/query-partial', controller: queryController }). otherwise({ redirectTo: '/landing' }); }]); 私はangularjsに最初にパーシャルをダウンロードさせ、リクエストされたときではなくダウンロードさせたいと思っています。 出来ますか？

190 angularjs 

戻るボタン付きのサイトヘッダーであるディレクティブがあり、クリックすると前のページに戻ります。どうすれば角度のある方法でそれを行うのですか？ 私が試してみました： <header class="title"> <a class="back" ng-class="icons"><img src="../media/icons/right_circular.png" ng-click="history.back()" /></a> <h1>{{title}}</h1> <a href="/home" class="home" ng-class="icons"><img src="../media/icons/53-house.png" /></a> </header> そしてこれはjsのディレクティブです： myApp.directive('siteHeader', function () { return { restrict: 'E', templateUrl: 'partials/siteHeader.html', scope: { title: '@title', icons: '@icons' } }; }); しかし、何も起こりません。$ locationについてangular.js APIを調べましたが、戻るボタンやについては何も見つかりませんでしたhistory.back()。

190 javascript  angularjs 

AngularJSでAjaxリクエストが与えられた $http.get("/backend/").success(callback); 別のリクエストが起動された場合にそのリクエストをキャンセルする最も効果的な方法は何ですか（同じバックエンド、異なるパラメーターなど）。

189 angularjs  promise  angular-promise  angular-http  cancellation 

アプリのリストでAngularを使用しようとしていますが、それぞれがアプリを詳細に表示するためのリンクです（apps/app.id）： <a id="{{app.id}}" href="apps/{{app.id}}" >{{app.name}}</a> これらのリンクの1つをクリックするたびに、ChromeはURLを次のように表示します unsafe:chrome-extension://kpbipnfncdpgejhmdneaagc.../apps/app.id どこunsafe:から来たのですか？

186 javascript  angularjs  security  google-chrome-extension 

Angularやと少し混同していますng-options。 単純な配列があり、それを使用して選択を初期化したい。しかし、私はそのオプションの値=ラベルが欲しいです。 script.js $scope.options = ['var1', 'var2', 'var3']; html <select ng-model="myselect" ng-options="o for o in options"></select> 私が得るもの： <option value="0">var1</option> <option value="1">var2</option> <option value="2">var3</option> 私が欲しいもの： <option value="var1">var1</option> <option value="var2">var2</option> <option value="var3">var3</option> だから私は試しました： <select ng-model="myselect2" ng-init=0 ng-options="options[k] as v for (k,v) in options"></select> <select ng-model="myselect3" ng-init=0 ng-options="b as b for b in …

186 angularjs  ng-grid  ng-options