คำถามติดแท็ก angularjs

ใช้สำหรับคำถามเกี่ยวกับ AngularJS (1.x), เฟรมเวิร์ก JavaScript แบบโอเพ่นซอร์ส อย่าใช้แท็กนี้สำหรับ Angular 2 หรือใหม่กว่า; ใช้แท็ก [angular] แทน

10
ถ้ามีคำสั่ง else ในเทมเพลต AngularJS
ฉันต้องการทำเงื่อนไขในเทมเพลต AngularJS ฉันดึงรายชื่อวิดีโอจาก Youtube API วิดีโอบางรายการมีอัตราส่วน 16: 9 และบางส่วนอยู่ในอัตราส่วน 4: 3 ฉันต้องการสร้างเงื่อนไขเช่นนี้: if video.yt$aspectRatio equals widescreen then element's attr height="270px" else element's attr height="360px" ฉัน iterating ng-repeatวิดีโอโดยใช้ ไม่มีความคิดว่าฉันควรทำอย่างไรสำหรับเงื่อนไขนี้: เพิ่มฟังก์ชั่นในขอบเขตหรือไม่ ทำในเทมเพลตหรือไม่

15
เครื่องมือค้นหาจัดการกับแอปพลิเคชัน AngularJS อย่างไร
ฉันเห็นปัญหาสองประการเกี่ยวกับแอปพลิเคชัน AngularJS เกี่ยวกับเครื่องมือค้นหาและ SEO: 1) เกิดอะไรขึ้นกับแท็กที่กำหนดเอง เครื่องมือค้นหาละเว้นเนื้อหาทั้งหมดภายในแท็กเหล่านั้นหรือไม่ นั่นคือสมมติว่าฉันมี <custom> <h1>Hey, this title is important</h1> </custom> จะ<h1>ได้รับการจัดทำดัชนีแม้จะอยู่ในแท็กที่กำหนดเองหรือไม่ 2) มีวิธีหลีกเลี่ยงเครื่องมือค้นหาของการจัดทำดัชนี {{}} ผูกมัดอย่างแท้จริงหรือไม่? กล่าวคือ <h2>{{title}}</h2> ฉันรู้ว่าฉันสามารถทำอะไรบางอย่างเช่น <h2 ng-bind="title"></h2> แต่ถ้าฉันต้องการให้ซอฟต์แวร์รวบรวมข้อมูล "เห็น" ชื่อจริง การเรนเดอร์ฝั่งเซิร์ฟเวอร์เป็นทางออกเดียวหรือไม่?

9
จะวนซ้ำคีย์และค่าด้วย ng-repeat ใน AngularJS ได้อย่างไร
ในตัวควบคุมของฉันฉันมีข้อมูลเช่น: $scope.object = data jsonตอนนี้ข้อมูลนี้เป็นพจนานุกรมที่มีคีย์และค่าจาก ฉันสามารถเข้าถึงแอททริบิวด้วยobject.nameในเทมเพลต มีวิธีใดบ้างที่ฉันสามารถทำซ้ำปุ่มมากกว่านี้และแสดงในตารางเช่น <tr><td> {{key}} </td> <td> data.key </td> ข้อมูลเป็นเช่นนี้ { "id": 2, "project": "wewe2012", "date": "2013-02-26", "description": "ewew", "eet_no": "ewew", }

29
ฉันจะผูกกับรายการค่าช่องทำเครื่องหมายด้วย AngularJS ได้อย่างไร
ฉันมีช่องทำเครื่องหมายไม่กี่: <input type='checkbox' value="apple" checked> <input type='checkbox' value="orange"> <input type='checkbox' value="pear" checked> <input type='checkbox' value="naartjie"> ที่ฉันต้องการที่จะผูกกับรายการในตัวควบคุมของฉันเช่นว่าเมื่อใดก็ตามที่มีการเปลี่ยนแปลงช่องทำเครื่องหมายตัวควบคุมรักษารายการของค่าการตรวจสอบทั้งหมดเช่น ['apple', 'pear']ที่ผมอยากจะผูกกับรายชื่อในการควบคุมของฉันเช่นว่าเมื่อใดก็ตามที่มีการเปลี่ยนแปลงช่องทำเครื่องหมายควบคุมการเก็บรักษารายการของทุกค่าการตรวจสอบสำหรับตัวอย่างเช่น ng-model ดูเหมือนจะสามารถผูกค่าของหนึ่งช่องเดียวให้กับตัวแปรในคอนโทรลเลอร์เท่านั้น มีวิธีอื่นอีกไหมที่ฉันสามารถผูกสี่ช่องทำเครื่องหมายไว้ที่รายการในคอนโทรลเลอร์

27
เหตุใด AngularJS จึงรวมตัวเลือกว่างไว้ในรายการ?
ฉันทำงานกับ AngularJS ในช่วงสองสามสัปดาห์ที่ผ่านมาและสิ่งหนึ่งที่รบกวนฉันจริงๆก็คือแม้หลังจากพยายามเปลี่ยนลำดับทั้งหมดหรือการกำหนดค่าที่กำหนดไว้ในสเปคที่http://docs.angularjs.org/api/ng .directive: selectฉันยังคงได้รับตัวเลือกว่างเป็นลูกคนแรกขององค์ประกอบที่เลือก นี่คือหยก: select.span9(ng-model='form.type', required, ng-options='option.value as option.name for option in typeOptions'); ที่นี่ตัวควบคุม: $scope.typeOptions = [ { name: 'Feature', value: 'feature' }, { name: 'Bug', value: 'bug' }, { name: 'Enhancement', value: 'enhancement' } ]; สุดท้ายนี่คือ HTML ที่สร้างขึ้น: <select ng-model="form.type" required="required" ng-options="option.value as option.name for option in …
652 angularjs 

15
จะใช้ฟิลเตอร์ในคอนโทรลเลอร์ได้อย่างไร?
ฉันได้เขียนฟังก์ชันตัวกรองซึ่งจะส่งคืนข้อมูลตามอาร์กิวเมนต์ที่คุณส่งผ่าน ฉันต้องการฟังก์ชั่นเดียวกันในคอนโทรลเลอร์ของฉัน เป็นไปได้ไหมที่จะใช้ฟังก์ชั่นตัวกรองซ้ำในคอนโทรลเลอร์? นี่คือสิ่งที่ฉันได้ลองมาแล้ว: function myCtrl($scope,filter1) { // i simply used the filter function name, it is not working. }

20
สับสนเกี่ยวกับการบริการเทียบกับโรงงาน
อย่างที่ฉันเข้าใจเมื่ออยู่ในโรงงานฉันจะส่งคืนวัตถุที่ถูกฉีดเข้าไปในคอนโทรลเลอร์ เมื่ออยู่ในบริการฉันกำลังจัดการกับวัตถุที่ใช้thisและไม่ส่งคืนสิ่งใด ฉันอยู่ภายใต้การสันนิษฐานว่าการบริการเป็นแบบซิงเกิลเสมอและวัตถุโรงงานใหม่จะถูกฉีดเข้าไปในตัวควบคุมทุกตัว อย่างไรก็ตามมันกลับกลายเป็นว่าวัตถุในโรงงานเป็นซิงเกิลตันด้วยหรือไม่ รหัสตัวอย่างที่จะสาธิต: var factories = angular.module('app.factories', []); var app = angular.module('app', ['ngResource', 'app.factories']); factories.factory('User', function () { return { first: 'John', last: 'Doe' }; }); app.controller('ACtrl', function($scope, User) { $scope.user = User; }); app.controller('BCtrl', function($scope, User) { $scope.user = User; }); เมื่อมีการเปลี่ยนแปลงuser.firstในACtrlปรากฎว่าuser.firstในBCtrlนอกจากนี้ยังมีการเปลี่ยนแปลงเช่นUserเป็นเดี่ยวหรือไม่? ข้อสันนิษฐานของฉันคืออินสแตนซ์ใหม่ถูกฉีดเข้าไปในคอนโทรลเลอร์ที่มีโรงงานหรือไม่
618 angularjs 

13
ผู้ควบคุม AngularJS หนึ่งคนสามารถเรียกอีกคนหนึ่งได้หรือไม่
เป็นไปได้ไหมที่จะมีคอนโทรลเลอร์หนึ่งอันใช้อีกคอนโทรลเลอร์หนึ่ง? ตัวอย่างเช่น: เอกสาร HTML นี้จะพิมพ์ข้อความที่จัดส่งโดยMessageCtrlคอนโทรลเลอร์ในmessageCtrl.jsไฟล์ <html xmlns:ng="http://angularjs.org/"> <head> <meta charset="utf-8" /> <title>Inter Controller Communication</title> </head> <body> <div ng:controller="MessageCtrl"> <p>{{message}}</p> </div> <!-- Angular Scripts --> <script src="http://code.angularjs.org/angular-0.9.19.js" ng:autobind></script> <script src="js/messageCtrl.js" type="text/javascript"></script> </body> </html> ไฟล์คอนโทรลเลอร์มีรหัสต่อไปนี้: function MessageCtrl() { this.message = function() { return "The current date is: " + new Date().toString(); }; …

7
AngularJS กำลังส่งข้อมูลไปยังคำขอ $ http.get
ฉันมีฟังก์ชั่นซึ่งทำหน้าที่ http POST รหัสที่ระบุด้านล่าง ใช้งานได้ดี $http({ url: user.update_path, method: "POST", data: {user_id: user.id, draft: true} }); ฉันมีฟังก์ชั่นอื่นสำหรับ http GET และฉันต้องการส่งข้อมูลไปยังคำขอนั้น แต่ฉันไม่มีตัวเลือกในการรับ $http({ url: user.details_path, method: "GET", data: {user_id: user.id} }); ไวยากรณ์สำหรับhttp.getคือ รับ (url, config)

27
ฉันจะตั้งค่าคุณสมบัติค่าใน AngularJS 'ng-options ได้อย่างไร
นี่คือสิ่งที่ดูเหมือนจะรบกวนผู้คนจำนวนมาก (รวมถึงฉัน) เมื่อใช้ng-optionsคำสั่งใน AngularJS เพื่อกรอกตัวเลือกสำหรับ<select>แท็กฉันไม่สามารถหาวิธีตั้งค่าสำหรับตัวเลือกได้ เอกสารสำหรับเรื่องนี้ไม่ชัดเจนจริง ๆ - อย่างน้อยสำหรับคนธรรมดาอย่างฉัน ฉันสามารถตั้งค่าข้อความสำหรับตัวเลือกได้อย่างง่ายดายเช่น: ng-options="select p.text for p in resultOptions" เมื่อresultOptionsเป็นเช่น: [ { "value": 1, "text": "1st" }, { "value": 2, "text": "2nd" } ] ควรเป็นสิ่งที่ง่ายที่สุดในการตั้งค่าตัวเลือก แต่จนถึงตอนนี้ฉันก็ไม่เข้าใจ

8
ความแตกต่างระหว่าง ng-model และ ng-bind คืออะไร
ฉันกำลังเรียนรู้ AngularJS และกำลังมีปัญหาในการทำความเข้าใจความแตกต่างระหว่างและng-bindng-model ใครสามารถบอกฉันว่าพวกเขาแตกต่างกันอย่างไรและเมื่อใดควรใช้กับอีกอันหนึ่ง


23
การรวมตัวควบคุมการเรียกใช้งาน AngularJS สองครั้ง
ฉันเข้าใจ AngularJS วิ่งผ่านโค้ดสองครั้งบางครั้งก็ยิ่งมากขึ้นเช่น$watchเหตุการณ์ตรวจสอบสถานะของโมเดลอย่างต่อเนื่องเป็นต้น อย่างไรก็ตามรหัสของฉัน: function MyController($scope, User, local) { var $scope.User = local.get(); // Get locally save user data User.get({ id: $scope.User._id.$oid }, function(user) { $scope.User = new User(user); local.save($scope.User); }); //... ถูกดำเนินการสองครั้งโดยแทรก 2 บันทึกลงในฐานข้อมูลของฉัน ฉันยังคงเรียนรู้อย่างชัดเจนขณะที่ฉันต่อสู้กับสิ่งนี้มานานแล้ว!
532 angularjs 

6
ลิงค์เทียบกับคอมไพล์ vs คอนโทรลเลอร์
เมื่อคุณสร้างคำสั่งคุณสามารถใส่รหัสลงในคอมไพเลอร์ฟังก์ชั่นลิงค์หรือตัวควบคุม ในเอกสารพวกเขาอธิบายว่า: รวบรวมและฟังก์ชั่นการเชื่อมโยงจะใช้ในขั้นตอนต่าง ๆ ของวงจรเชิงมุม ตัวควบคุมจะใช้ร่วมกันระหว่างคำสั่ง อย่างไรก็ตามสำหรับฉันมันยังไม่ชัดเจนรหัสประเภทไหนควรไปที่ไหน เช่น: ฉันสามารถสร้างฟังก์ชั่นในการคอมไพล์และแนบกับขอบเขตในลิงค์หรือแนบฟังก์ชั่นเข้ากับขอบเขตในคอนโทรลเลอร์ได้หรือไม่? คอนโทรลเลอร์มีการใช้งานร่วมกันอย่างไรระหว่างคำสั่งหากแต่ละคำสั่งสามารถมีตัวควบคุมได้? คอนโทรลเลอร์ใช้งานร่วมกันจริง ๆ หรือเป็นเพียงคุณสมบัติขอบเขตหรือไม่

10
อะไรคือความแตกต่างระหว่างองค์ประกอบโพลิเมอร์และคำสั่ง AngularJS?
ในหน้าโพลิเมอร์เริ่มต้นเราจะเห็นตัวอย่างของการใช้งานโพลิเมอร์: <html> <head> <!-- 1. Shim missing platform features --> <script src="polymer-all/platform/platform.js"></script> <!-- 2. Load a component --> <link rel="import" href="x-foo.html"> </head> <body> <!-- 3. Declare the component by its tag. --> <x-foo></x-foo> </body> </html> สิ่งที่คุณจะสังเกตเห็นจะ<x-foo></x-foo>ถูกกำหนดโดยและplatform.jsx-foo.html ดูเหมือนว่านี่จะเทียบเท่ากับโมดูล directive ใน AngularJS: angular.module('xfoo', []) .controller('X-Foo', ['$scope',function($scope) { $scope.text = 'hey hey!'; }) …

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.