Tag: angularjs

错误：无法在’XMLHttpRequest’上执行’send’：无法加载’file’：AngularJS SPA

我是Angular SPA的新手，我第一次通过Googling获得代码并尝试运行。 但是我在Console中遇到了一些错误。 我无法弄清楚原因，我找到了以下控制台错误的列表： XMLHttpRequest无法加载file：/// C：/Users/hp/Downloads/single-page-app-angularjs-master/home.html。 交叉源请求仅支持协议方案：http，数据，chrome，chrome-extension，https，chrome-extension-resource。 错误：无法在’XMLHttpRequest’上执行’send’：无法加载’file：/// C：/Users/hp/Downloads/single-page-app-angularjs-master/home.html’。 XMLHttpRequest无法加载file：/// C：/Users/hp/Downloads/single-page-app-angularjs-master/about.html。 交叉源请求仅支持协议方案：http，数据，chrome，chrome-extension，https，chrome-extension-resource。 错误：[$ compile：tpload] http://errors.angularjs.org/1.3.3/ $ compile / tpload？p0 = home.html Single page web app using Angularjs Home(current) About us Read tutorial

jQuery自动完成+ AngularJS的问题

我在我的页面上使用AjgularJS，并希望添加一个字段以使用jqueryui中的自动完成function，并且自动完成function不会触发ajax调用。 我已经在没有角度（ng-app和ng-controller）的页面上测试了脚本并且它运行良好，但是当我将脚本放在带有angularjs的页面上时它会停止工作。 任何的想法？ jquery脚本： $(function () { $(‘#txtProduct’).autocomplete({ source: function (request, response) { alert(request.term); }, minLength: 3, select: function (event, ui) { } }); }); 有趣的是：当我在Chrome检查器上调用脚本时，自动完成function开始工作！ 版本：AngularJS：1.0.2 – JqueryUI：1.9.0 结论：来自jQueryUI的自动完成小部件必须从AngularJS的自定义指令内部初始化，例如： 标记 index ddd 角度脚本 var app = angular.module(‘TestApp’, []); function TestCtrl($scope) { } app.directive(‘autoComplete’, function () { return function postLink(scope, iElement, iAttrs) { $(function () […]

AngularJS：$ viewContentLoaded在部分视图出现之前触发

对于局部视图，我想做一些我通常用$(document).ready(function() {…})做的JavaScript，比如将venet监听器绑定到元素。 我知道这对AngularJS和加载到“根”视图中的部分视图不起作用。 因此，我向侦听器添加了一个侦听器，侦听器监听$viewContentLoaded事件。 调用侦听器的函数，因此事件被触发但在我看来好像是在呈现局部视图之前。 当我在侦听器的函数中设置断点并使用firebug调试它时，我也没有看到元素，函数中的jquery选择也没有找到局部视图的元素。 这就是控制器的样子： angular.module(‘docinvoiceClientAngularjsApp’) .controller(‘LoginController’, function ($scope, $rootScope) { $scope.$on(‘$viewContentLoaded’, function(event) { console.log(“content loaded”); console.log($(“#loginForm”)); // breakpoint here }); […] 我想我做错了，因为如果这是一个常见的错误，必须在stackoverflow上发布更多post。 当我使用ui-router和ui-view时 ，我会给你一个路由文件的摘录： angular .module(‘docinvoiceClientAngularjsApp’, [ ‘ui.router’, ‘ngAnimate’, ‘ngCookies’, ‘ngResource’, ‘ngMessages’, ‘ngRoute’, ‘ngSanitize’, ‘ngTouch’ ]) .config(function ($routeProvider, $stateProvider) { $stateProvider .state(‘login’, { url: ‘/’, templateUrl: ‘components/login/loginView.html’, controller: ‘LoginController’ }) .run([‘$state’, function […]

jQuery和AngularJS：将事件绑定到更改DOM

在AngularJS的DOM中，我在ng-repeat指令中使用了ng-include。 它正在加载HTML就好了。 无论如何，我遇到的一个问题是我正在使用JQuery（最新版本）来绑定DOM上的元素上的鼠标点击事件和与ng-repeat和include添加到DOM的类相同的类。 但是，JQuery似乎并没有将事件处理程序应用于新的DOM添加。 在以前的版本中.live（）似乎做了我想要的，但它已在最新版本中删除。 我是否应该清除元素上的绑定并在每次添加类的其他元素时重新创建它们？

如何减去两个angularjs日期变量

我对angularjs相当新，但在这里它。 我可以通过dj dd/mm/yyyyforms的angularjs两个日期，但我需要做的是以某种方式减去两个日期以获得两者之间的天数差异。 我创建了一个jquery函数来执行此操作，但我不知道如何将两个日期传递给函数。 所以我想知道是否有不同的方法可以解决这个问题？ 我正在尝试根据两个日期之间的天数来设置触发系统，以便对某些事物进行风格化。 例如，如果它在10天内，我希望它使用样式1 ，如果它在20天内使用样式2 ，依此类推。

AngularJS：延迟加载控制器和内容

在这个简化的场景中，我有两个文件：index.htm，lazy.htm。 index.htm的： var myApp = angular.module(‘myApp’, []); myApp.controller(’embed’,function($scope){ $scope.embed = ‘Embedded Controller’; }); {{embed}} lazy.htm myApp.controller(‘lazy’,function($scope){ $scope.lazy = ‘Lazy Controller’; }); {{lazy}} 结果是一个错误：“Argument’lazy’不是函数，未定义” 改为使用函数 lazy.htm function lazy($scope) { $scope.lazy = ‘Lazy Controller’; } {{lazy}} 这可以使用到版本1.3 beta 14.在beta 15中删除了全局控制器function： https ： //github.com/angular/angular.js/issues/8296 那么现在，动态获取lazy.htm的愤怒内容的更好方法是什么？ 更新： 在本文（ http://ify.io/lazy-loading-in-angularjs ）中，我找到了另一种可能的解决方案。 $ controllerProvider允许我们在角度引导之后注册新的控制器。 奇迹般有效。 在v1.3.0-beta.18中测试 index.htm的： var myApp = angular.module(‘myApp’, […]

在AngularJS中轻松控制dom – 单击按钮，然后将焦点设置为输入元素

我有这个角度代码： {{element.name}} 我想要发生的事情：当用户点击按钮时 – 输入元素将被聚焦。 单击按钮元素并将其聚焦后，如何找到输入元素？ 我可以做一个看起来像这样的函数： function doSomething(element,$event) { //option A – start manipulating in the dark: $event.srcElement.parentNode.childNodes[1] //option B – wrapping it with jQuery: $($event.srcElement).closest(‘.element-wrapper’).find(‘input’).focus(); } 它们都不起作用 – 有更好的角度方法吗？ 在jQuery中使用.closest()和.find()等函数？ 更新： 我发现这个黑客工作（但它似乎仍然不是正确的解决方案） ： function doSomething(element,$event) { setTimeout(function(){ $($event.srcElement).closest(‘.element-wrapper’).find(‘input’).focus(); },0) } 我用setTimeout包装它，所以在Angular完成它的所有操作后，它会聚焦在input元素上。

如何在javaScript中实现分层多级数据表？

我正在实现多级数据表而不使用任何插件或库。 我想基于javaScript，JQuery或angular js实现。 我在下面查了一个链接， 使用JavaScript遍历JSON对象树的所有节点 使用ng-repeat的嵌套表 但我的json结构与上面的链接不同。 我需要在Tree Structure UI中显示我的JSON。 我没有硬编码级别的HTML。 所有级别都应该通过javascript处理。 我已经实现了jsfiddle： http ： //jsfiddle.net/varunPes/0n9fmawb/40/ JSON结构 [ { Home:{ “checkbox_view”:true, “checkbox_edit”:false, “checkbox_delete”:true } }, { “watchColorWorld”:{ “local”:{ “app-local-black”:{ “checkbox_view”:true, “checkbox_edit”:true, “checkbox_delete”:true } }, “global”:{ “app-global-red”:{ “checkbox_view”:true, “checkbox_edit”:true, “checkbox_delete”:true } }, “world”:{ “app-world-green”:{ “checkbox_view”:true, “checkbox_edit”:true, “checkbox_delete”:true } } } }, { “systemMgmt”:{ “checkbox_view”:true, “checkbox_edit”:true, “checkbox_delete”:true […]

我们应该在AngularJS中使用jQuery吗？

我们的网站目前正在使用jQuery库，每月流量约为100万。 我们希望包含以API为中心的方法，因此决定转向Javascript MVC并选择angularJS。 现在我的问题是，我应该在Angular的顶部使用jQuery，以便我需要重写最小的DOM操作代码，或者我应该以Angular方式重写所有内容？ 我们正在使用像plupload，jQuery UI这样的jQuery插件。 在网站上等。 请建议最佳的迁移方式（页面加载时间也很重要）。 如果我有jQuery背景，已经通过“Thinking in AngularJS”了吗？ 但没有得到一个明确的答案

在Angular JS中跳过重复JSON排序

当我使用ng-repeat（可能是一种无痛的方式）时，有没有人知道如何完全跳过 JSON排序？ 例如，我的源JSON看起来像这样 – { “title”: “Title”, “description”: “Description”, “moreInfo”: “Moreinformation” } 一旦我在ng-repeat中使用它，它就按字母顺序排序。 像这样的东西 – { “description”: “Description”, “moreInfo”: “Moreinformation”, “title”: “Title” } 我的ng-repeat看起来像这样 – {{key}} {{data}} 我见过人们有一个单独的键数组，并使用它们来识别JSON对象，最终避免按字母顺序排序。 有一种优雅的方式来做到这一点？