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

ฉันมีเหตุการณ์คลิกที่เกิดขึ้นนอกขอบเขตของคำสั่งที่กำหนดเองดังนั้นแทนที่จะใช้แอตทริบิวต์ "ng-click" ฉันใช้ jQuery.click () listener และเรียกใช้ฟังก์ชันภายในขอบเขตของฉันดังนี้: $('html').click(function(e) { scope.close(); ); close () เป็นฟังก์ชั่นง่าย ๆ ที่มีลักษณะดังนี้: scope.close = function() { scope.isOpen = false; } ในมุมมองของฉันฉันมีองค์ประกอบที่มี "ng-show" ถูกผูกไว้กับ isOpen ดังนี้: <div ng-show="isOpen">My Div</div> เมื่อตรวจแก้จุดบกพร่องฉันพบว่ามีการเรียกว่า close () isOpen กำลังได้รับการอัปเดตเป็นเท็จ แต่มุมมอง AngularJS ไม่ได้อัปเดต มีวิธีที่ฉันสามารถบอก Angular ให้อัปเดตมุมมองด้วยตนเองได้หรือไม่ หรือมีวิธี "เชิงมุม" มากขึ้นในการแก้ไขปัญหาที่ฉันไม่เห็นหรือไม่

168 javascript  angularjs 

ฉันมองว่าตัวกรองทำงานอย่างไรใน Angularjs และฉันเห็นว่าเราต้องส่งวงเล็บ 2 ชุด $filter('number')(number[, fractionSize]) มันหมายถึงอะไรและเราจะจัดการกับ JavaScript อย่างไร

168 javascript  angularjs 

ฉันมีตารางที่สร้างขึ้นโดยใช้ ng-repeat ฉันต้องการเพิ่มการตรวจสอบความถูกต้องของแต่ละองค์ประกอบในตาราง ปัญหาคือแต่ละอินพุตเซลล์มีชื่อเดียวกันกับเซลล์ด้านบนและด้านล่าง ฉันพยายามใช้{{$index}}ค่าเพื่อตั้งชื่ออินพุต แต่แม้ว่าตัวอักษรสตริงใน HTML จะปรากฏอย่างถูกต้อง แต่ตอนนี้ก็ใช้งานได้แล้ว นี่คือรหัสของฉัน ณ ตอนนี้: <tr ng-repeat="r in model.BSM "> <td> <input ng-model="r.QTY" class="span1" name="QTY{{$index}}" ng-pattern="/^[\d]*\.?[\d]*$/" required/> <span class="alert-error" ng-show="form.QTY{{$index}}.$error.pattern"><strong>Requires a number.</strong></span> <span class="alert-error" ng-show="form.QTY{{$index}}.$error.required"><strong>*Required</strong></span> </td> </tr> ฉันได้ลองลบออก{{}}จากดัชนี แต่ไม่ได้ผล ณ ตอนนี้คุณสมบัติการตรวจสอบของอินพุตทำงานอย่างถูกต้อง แต่ข้อความแสดงข้อผิดพลาดไม่ปรากฏขึ้น ใครมีข้อเสนอแนะ? แก้ไข:นอกเหนือจากคำตอบที่ดีด้านล่างนี่คือบทความบล็อกที่ครอบคลุมปัญหานี้ในรายละเอียดเพิ่มเติม: http://www.thebhwgroup.com/blog/2014/08/angularjs-html-form-design-part-2 /

167 javascript  html  angularjs  validation  grid 

นี่คือข้อความแสดงข้อผิดพลาดที่ฉันได้รับ: Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://www.youtube.com') does not match the recipient window's origin ('http://localhost:9000'). ผมเคยเห็นปัญหาอื่น ๆ ที่คล้ายกันที่แหล่งกำเนิดเป้าหมายhttp://www.youtube.comและต้นกำเนิดผู้รับอยู่https://www.youtube.comแต่ไม่มีผู้ใดเช่นเหมืองที่เป้าหมายคือและที่มาคือhttps://www.youtube.comhttp://localhost:9000 ฉันไม่ได้รับปัญหา อะไรคือปัญหา? ฉันจะแก้ไขได้อย่างไร

167 javascript  angularjs  youtube  youtube-api  youtube-iframe-api 

ฉันสามารถตั้งค่าเส้นทางด้วย params เผื่อเลือก (เทมเพลตและคอนโทรลเลอร์เดียวกันได้ แต่ควรละเว้นบาง params หากไม่มีอยู่หรือไม่? ดังนั้นแทนที่จะเขียนกฎสองข้อต่อไปนี้มีเพียงกฎเดียวหรือไม่ module.config(['$routeProvider', function($routeProvider) { $routeProvider. when('/users/', {templateUrl: 'template.tpl.html', controller: myCtrl}). when('/users/:userId', {templateUrl: 'template.tpl.html', controller: myCtrl}) }]); บางสิ่งเช่นนี้ ([พารามิเตอร์นี้เป็นตัวเลือก]) when('/users[/:userId]', {templateUrl: 'template.tpl.html', controller: myCtrl}) //note: this previous doesn't work ฉันไม่พบสิ่งใดในเอกสารของพวกเขา

166 angularjs  angularjs-routing 

ฉันมีชุดของ<li>องค์ประกอบ <ul> <li ng-class="{current: selected == 100}"> <a href ng:click="selected=100">ABC</a> </li> <li ng-class="{current: selected == 101}"> <a href ng:click="selected=101">DEF</a> </li> <li ng-class="{current: selected == $index }" ng-repeat="x in [4,5,6,7]"> <a href ng:click="selected=$index">A{{$index}}</a> </li> </ul> เมื่อผู้ใช้คลิกที่หนึ่งในองค์ประกอบที่อยู่ด้านบนแล้วมันควรตั้งค่าของการเลือกและแสดง<DIV>องค์ประกอบหนึ่งด้านล่าง: <div ng:show="selected == 100">100</div> <div ng:show="selected == 101">101</div> <div ng-repeat="x in [4,5,6,7]" ng:show="selected == $index">{{ …

166 angularjs 

ฉันมีชุดข้อมูลขนาดใหญ่หลายพันแถวโดยมีฟิลด์ประมาณ 10 ฟิลด์แต่ละแห่งมีข้อมูลประมาณ 2MB ฉันต้องแสดงมันในเบราว์เซอร์ วิธีการที่ตรงไปตรงมาส่วนใหญ่ (ดึงข้อมูลใส่เข้าไป$scopeให้ng-repeat=""งานทำ) ทำงานได้ดี แต่จะหยุดเบราว์เซอร์ประมาณครึ่งนาทีเมื่อมันเริ่มแทรกโหนดใน DOM ฉันจะแก้ไขปัญหานี้ได้อย่างไร ทางเลือกหนึ่งคือการผนวกแถวเป็นส่วน$scopeเพิ่มและรอngRepeatให้แทรกก้อนอันหนึ่งเข้าไปใน DOM ให้เสร็จก่อนที่จะย้ายไปยังแถวถัดไป แต่ AFAIK ngRepeat จะไม่รายงานกลับเมื่อเสร็จสิ้น "การทำซ้ำ" ดังนั้นมันจะน่าเกลียด ตัวเลือกอื่นคือการแบ่งข้อมูลบนเซิร์ฟเวอร์ออกเป็นหน้าต่างๆและดึงข้อมูลออกมาในหลาย ๆ คำร้องขอ ฉันดูเอกสารเชิงมุมในการค้นหาสิ่งที่ต้องการng-repeat="data in dataset" ng-repeat-steps="500"แต่ไม่พบอะไรเลย ฉันค่อนข้างใหม่กับวิธีการเชิงมุมดังนั้นจึงเป็นไปได้ที่ฉันจะพลาดจุดนี้อย่างสมบูรณ์ แนวปฏิบัติที่ดีที่สุดในเรื่องนี้คืออะไร?

165 javascript  angularjs  angularjs-ng-repeat 

ฉันหวังว่านี่จะช่วยให้ใครบางคนปวดหัวด้วยสไตล์ที่ใช้เครื่องหมายขีดคั่นโดยเฉพาะอย่างยิ่งเมื่อ bootstrap ได้รับความนิยม ฉันใช้มุมฉาก 1.0.5 <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.js"></script> ในเอกสารประกอบ ngClassตัวอย่างนั้นง่าย แต่ก็ยังกล่าวถึงการแสดงออกสามารถเป็นแผนที่ของชื่อชั้นเรียนเพื่อค่าบูลีน ฉันพยายามใช้สไตล์ "ไอคอนขาว" บนไอคอนของฉันดังที่แสดงในเอกสารประกอบการบูตขึ้นอยู่กับตัวแปรบูลีน <i class="icon-home" ng-class="{icon-white: someBooleanValue}"> บรรทัดข้างต้นไม่ทำงาน ชั้นจะไม่ผนวกเข้ากับicon-whiteเมื่อsomeBooleanValueเป็นจริง อย่างไรก็ตามถ้าฉันเปลี่ยนคีย์เป็นiconWhiteมันจะถูกเพิ่มไปยังรายการของค่าระดับ เราจะเพิ่มมูลค่าด้วยเครื่องหมายขีดกลางได้อย่างไร

165 angularjs 

ฉันมีฟังก์ชั่นที่ฉันต้องการโทรหลังจากโหลดเนื้อหาหน้า ฉันอ่านเกี่ยวกับ $ viewContentLoaded และใช้ไม่ได้สำหรับฉัน ฉันกำลังมองหาบางอย่างเช่น document.addEventListener('DOMContentLoaded', function () { //Content goes here }, false); การโทรด้านบนไม่ทำงานสำหรับฉันในตัวควบคุม AngularJs

163 angularjs  events  loaded 

ไฟล์ต่อไปนี้ "ทำงาน" (ความรู้สึกว่ามันไม่ได้เกิดข้อผิดพลาดใด ๆ ): <!doctype html> <html ng-app="modx"> <script src="http://code.angularjs.org/angular-1.0.0rc7.js"></script> <script> angular.module("modx", [], function($routeProvider) { }); </script> </html> แต่นี่ <!doctype html> <html ng-app="modx"> <script src="http://code.angularjs.org/angular-1.0.0rc7.js"></script> <script> angular.module("modx", [], function($routeProvider, $rootScope) { }); </script> </html> ให้ข้อผิดพลาด: ข้อผิดพลาด: ผู้ให้บริการที่ไม่รู้จัก: $ rootScope จาก ไฟล์ต้นฉบับmodx : http://code.angularjs.org/angular-1.0.0rc7.js บรรทัด: 2491 WTF?

162 angularjs 

ปิด. คำถามนี้ไม่เป็นไปตามหลักเกณฑ์กองมากเกิน ไม่ยอมรับคำตอบในขณะนี้ ต้องการปรับปรุงคำถามนี้หรือไม่ อัปเดตคำถามเพื่อให้เป็นไปตามหัวข้อสำหรับ Stack Overflow ปิดให้บริการใน5 ปีที่ผ่านมา ปรับปรุงคำถามนี้ ไม่มีใครทราบว่ามีการอ้างอิงอย่างเป็นทางการหรือเป็นที่ยอมรับมากที่สุดสำหรับข้อตกลงการตั้งชื่อเชิงมุมที่จะใช้เมื่อเราสร้างแอปพลิเคชันของเราหรือไม่? เชิงมุมมีส่วนประกอบที่แตกต่างกันมากมายเช่นตัวกรองคำสั่งบริการและอื่น ๆ คุณจะไม่เห็นด้วยหรือไม่ว่าการมีการตั้งชื่อแบบแผนอ้างอิงเมื่อเรานำไปใช้ในแอปพลิเคชันของเราจะสมเหตุสมผล ตัวอย่างเช่น: หากเราต้องการสร้างตัวกรองใหม่เราควรตั้งชื่ออย่างไรเช่น [Something] ตัวกรองหรือตัวกรอง [Something] หรืออย่างอื่น และเช่นเดียวกับตัวควบคุมบริการคำสั่งและอื่น ๆ สิ่งอื่น ๆ ที่ฉันสงสัยคือถ้าตัวแปร / ฟังก์ชั่นที่อยู่ในขอบเขตควรมีส่วนเสริมหรือส่วนต่อท้ายพิเศษ ในบางสถานการณ์อาจมีประโยชน์ที่จะมีวิธีแยกความแตกต่างจากฟังก์ชั่นและอื่น ๆ (ไม่มีรหัสเชิงมุม)

162 angularjs 

ฉันกำลังมองหาวิธีปฏิบัติที่ดีที่สุดในการเชื่อมโยงกับคุณสมบัติบริการใน AngularJS ฉันได้ทำงานผ่านหลายตัวอย่างเพื่อเข้าใจวิธีเชื่อมโยงกับคุณสมบัติในบริการที่สร้างขึ้นโดยใช้ AngularJS ด้านล่างฉันมีสองตัวอย่างของวิธีการเชื่อมโยงกับคุณสมบัติในบริการ พวกเขาทั้งสองทำงาน ตัวอย่างแรกใช้การเชื่อมโยงพื้นฐานและตัวอย่างที่สองใช้ $ scope $ watch เพื่อเชื่อมโยงกับคุณสมบัติของบริการ ตัวอย่างเหล่านี้เป็นที่ต้องการเมื่อเชื่อมโยงกับคุณสมบัติในบริการหรือมีตัวเลือกอื่นที่ฉันไม่ทราบว่าจะแนะนำหรือไม่ หลักฐานของตัวอย่างเหล่านี้คือบริการควรอัปเดตคุณสมบัติ "lastUpdated" และ "การโทร" ทุก 5 วินาที เมื่ออัปเดตคุณสมบัติของบริการแล้วมุมมองควรสะท้อนถึงการเปลี่ยนแปลงเหล่านี้ ตัวอย่างทั้งสองนี้ทำงานได้สำเร็จ ฉันสงสัยว่ามีวิธีที่ดีกว่าในการทำมัน การผูกแบบพื้นฐาน รหัสต่อไปนี้สามารถดูและวิ่งได้ที่นี่: http://plnkr.co/edit/d3c16z <html> <body ng-app="ServiceNotification" > <div ng-controller="TimerCtrl1" style="border-style:dotted"> TimerCtrl1 <br/> Last Updated: {{timerData.lastUpdated}}<br/> Last Updated: {{timerData.calls}}<br/> </div> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.js"></script> <script type="text/javascript"> var app = angular.module("ServiceNotification", …

162 angularjs  data-binding  angularjs-service  angularjs-controller 

ตามที่เป็นอยู่ในปัจจุบันคำถามนี้ไม่เหมาะสำหรับรูปแบบคำถาม & คำตอบของเรา เราคาดหวังคำตอบที่จะได้รับการสนับสนุนจากข้อเท็จจริงการอ้างอิงหรือความเชี่ยวชาญ แต่คำถามนี้มีแนวโน้มที่จะเรียกร้องการอภิปรายการโต้แย้งการหยั่งเสียงหรือการอภิปรายเพิ่มเติม หากคุณรู้สึกว่าคำถามนี้สามารถปรับปรุงและเปิดใหม่ได้โปรดไปที่ศูนย์ช่วยเหลือเพื่อขอคำแนะนำ ปิดให้บริการใน7 ปีที่ผ่านมา AngularJS นั้นทรงพลังมากเมื่อพูดถึง HTML5 เชิงโต้ตอบและการเชื่อมโยงโมเดล ในทางตรงกันข้าม PHP framework เช่น Yii ช่วยให้การพัฒนาแอปพลิเคชั่นเว็บที่รวดเร็วมีโครงสร้างปลอดภัยและมีประสิทธิภาพ เทคโนโลยีทั้งสองมีวิธีการที่ซับซ้อนสำหรับการเข้าถึงข้อมูลการวนซ้ำและการจัดหน้า เป็นการดีหรือไม่ดีที่จะผสมผสานทั้งสองวิธีนี้ (การตั้งค่าหน้ากระดาษ "ฝั่งไคลเอ็นต์และฝั่งเซิร์ฟเวอร์") หรือเป็นการเปรียบเทียบกับความหมายของแอปพลิเคชันเว็บ HTML5 AJAX แบบอินเทอร์แอคทีฟ ฉันไม่ได้พูดถึงการสร้าง JS โดยใช้ PHP ( ดูคำถามนี้ ) - ฉันกำลังพูดถึงการสร้างมุมมองที่จะใช้ประโยชน์จาก AngularJS ฉันยังรู้ว่าหน้า AngularJS ควร (หรือสามารถ) สื่อสารกับเซิร์ฟเวอร์ผ่านบริการ REST เพื่อรับข้อมูล ( ดูคำถามนี้ ) แทนที่จะดึงจากตัวอย่าง PHP ตัวแปรโดยตรง แต่สำหรับฉันแล้วมันดูเหมือนสะดวกกว่าในการออกแบบ …

161 php  web-applications  angularjs 

ฉันมีคำสั่งแบบฟอร์มที่ใช้callbackคุณลักษณะที่ระบุกับขอบเขต isolate: scope: { callback: '&' } มันอยู่ภายในng-repeatดังนั้นการแสดงออกที่ฉันผ่านรวมถึงidวัตถุที่เป็นข้อโต้แย้งกับฟังก์ชั่นการโทรกลับ: <directive ng-repeat = "item in stuff" callback = "callback(item.id)"/> เมื่อฉันทำตามคำสั่งเสร็จแล้วจะเรียกใช้$scope.callback()จากฟังก์ชั่นควบคุม สำหรับกรณีส่วนใหญ่สิ่งนี้เป็นเรื่องปกติและทุกอย่างที่ฉันต้องการจะทำ แต่บางครั้งฉันก็ต้องการที่จะเพิ่มการโต้แย้งจากภายในdirectiveตัวเอง มีการแสดงออกเชิงมุมที่จะช่วยให้นี้: $scope.callback(arg2)ส่งผลให้callbackถูกเรียกด้วยarguments = [item.id, arg2]? ถ้าไม่เป็นเช่นนั้นวิธีที่ประณีตที่สุดในการทำเช่นนี้คืออะไร? ฉันพบว่าใช้งานได้: <directive ng-repeat = "item in stuff" callback = "callback" callback-arg="item.id"/> กับ scope { callback: '=', callbackArg: '=' } และคำสั่งโทร $scope.callback.apply(null, [$scope.callbackArg].concat([arg2, arg3]) ); …

160 javascript  angularjs  angularjs-directive  angularjs-scope 

ฉันมีตัวอย่าง angularJS <div ng-controller="testCtrl"> <test color1="color1" updateFn="updateFn()"></test> </div> <script> angular.module('dr', []) .controller("testCtrl", function($scope) { $scope.color1 = "color"; $scope.updateFn = function() { alert('123'); } }) .directive('test', function() { return { restrict: 'E', scope: {color1: '=', updateFn: '&'}, template: "<button ng-click='updateFn()'>Click</button>", replace: true, link: function(scope, elm, attrs) { } } }); </script> …

160 angularjs