我正在努力理解模型的范围及其对范围有限的指令的约束.
我认为限制指令的范围意味着控制器.$ scope和directive.scope不再是同一个东西.但是,我对如何在指令模板或html中放置模型影响数据绑定感到困惑.我觉得我缺少一些非常基础的东西,继续前进我需要理解这一点.
请使用以下代码(在此处小提琴:http://jsfiddle.net/2ams6/)
JavaScript的
var app = angular.module('app',[]);
app.controller('Ctrl',function($scope){
});
app.directive('testel', function(){
return {
restrict: 'E',
scope: {
title: '@'
},
transclude: true,
template: '<div ng-transclude>'+
'<h3>Template title: {{title}}</h3>' +
'<h3>Template data.title:{{data.title}}</h3>' +
'</div>'
}
});
HTML
<div ng-app='app'>
<div ng-controller="Ctrl">
<input ng-model="data.title">
<testel title="{{data.title}}">
<h3>Transclude title:{{title}}</span></h3>
<h3>Transclude data.title:{{data.title}}</h3>
</testel>
</div>
</div>
模型仅{{title}}在模板内和翻译{{data.title}}中更新.为什么不在翻译{{title}}中也不{{data.title}}在模板中？
将输入移动到translude中就像这样(在这里小提琴:http://jsfiddle.net/eV8q8/1/):
<div ng-controller="Ctrl">
<testel title="{{data.title}}">
<input ng-model="data.title">
<h3>Transclude title: …我有这些数据:
[{"id":"42","firstname":"Sarah","lastname":"Dilby","age":"40","cars":"Yaris"},
{"firstname":"Jason","lastname":"Diry","age":"5","id":"5"},
{"id":"6","firstname":"Bilson","lastname":"Berby","age":"1","cars":"Tipo"}]
当我在ng-repeat中按顺序id或年龄时,它会将数字排序为文本.由于我无法在任何地方发现这是一个问题,我猜我的代码存在问题.我创建了这个小提琴:http://jsfiddle.net/vsbGH/1/抱歉模板,但jsfiddle不允许在html框中.无论如何,这是加载和排序数据的代码:
//user data
app.service('People', function() {
var People = {};
People.details = [{"id":"42","firstname":"Sarah","lastname":"Dilby","age":"40","cars":"Yaris"},
{"firstname":"Jason","lastname":"Diry","age":"5","id":"5"},
{"id":"6","firstname":"Bilson","lastname":"Berby","age":"1","cars":"Tipo"}]
return People;
});
//list ctrl
controllers.listCtrl = function ($scope,People) {
$scope.people = People.details;
$scope.sortList = function(sortname) {
$scope.sorter = sortname;
}
}
这是模板的ng-repeat部分:
<tr ng-repeat="person in people | orderBy:sorter ">
<td>{{person.id | number}}</td>
<td>{{person.firstname}} </td>
<td>{{person.lastname}} </td>
<td>{{person.age | number}}</td>
<td>{{person.cars}} </td>
</tr>
非常感谢,如果你能帮助我理解为什么数字数据不是作为数字排序,以及为什么它作为文本排序.
我正在关注一个为初学者提供的backbone.js教程,而且我遇到了第一个障碍.我TypeError: a.apply is not a function在firebug中遇到错误(Firefox 20.0.1).我有以下代码:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Backbone Test</title>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/css/bootstrap.min.css" />
<meta charset="utf-8" />
</head>
<body>
<div class="container">
<h1>User Manager</h1>
<hr />
<div class="page"></div>
</div>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.2/underscore-min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min.js" type="text/javascript"></script>
<script>
var Router = new Backbone.Router.extend({
routes: {
'': 'home'
}
});
var router = new Router();
</script>
</body>
</html>
我正在使用这些旧版本的jquery,下划线和主干,因为它们是本教程中使用的版本.我尝试使用所有的当前版本,我得到一个类似的错误:"TypeError:i .apply不是一个函数".
创建路由器实例时会发生错误,即var router = new Router();上面的行:
这个错误与我的设置有关吗？WAMP,或代码,或库？我无法理解它,因为它与 …
我使用$http拦截器来捕获 ajax 提交后的所有事件。由于某种原因，我无法抛出requestError. 我已经设置了一个测试应用程序来尝试调用requestError，但到目前为止我只能获取多个responseErrors.
来自angularjs文档：
requestError：当前一个拦截器抛出错误或通过拒绝解决时，拦截器被调用。
这是我的测试代码。
.factory('httpInterceptor',['$q',function(q){
var interceptor = {};
var uniqueId = function uniqueId() {
return new Date().getTime().toString(16) + '.' + (Math.round(Math.random() * 100000)).toString(16);
};
interceptor.request = function(config){
config.id = uniqueId();
console.log('request ',config.id,config);
return config;
};
interceptor.response = function(response){
console.log('response',response);
return response;
};
interceptor.requestError = function(config){
console.log('requestError ',config.id,config);
return q.reject(config);
};
interceptor.responseError = function(response){
console.log('responseError ',response.config.id,response);
return q.reject(response);
};
return interceptor;
}])
.config(['$httpProvider',function($httpProvider) {
$httpProvider.interceptors.push('httpInterceptor');
}]) …采用一个简单的匿名函数,它接受3个参数:
function hello(firstname, surname, city) {
console.log('Hi ' + firstname + ' ' +
surname + '. I see you\'re from ' + city)
}
使用函数方法"call"调用此函数有什么好处,只需调用函数？,即.
hello('Jane','Mansfield','Philadelphia');
VS
hello.call(this,'Jane','Mansfield','Philadelphia');
Fiddle-dee-dee:http://jsfiddle.net/wC3xz/1/
对不起,但是查看文档并没有任何消息.我唯一能想到的是你是否可以访问传递给函数的this对象.但是不会从匿名函数中访问这个在匿名函数即窗口的上下文中吗？
何时需要调用而不仅仅是functionname(args)？
拿这个jsfiddle.如果单击蓝色方块,将出现一个带有紫色子方块的红色方块(如果您是色盲则道歉):
$('#holder').click(function(){
$(this).children('.parent').show();
});
这很好用.单击紫色子方块时,红色父方块应隐藏:
$('.child').click(function(){
$(this).parent().hide();
console.log($(this).parent().css('display'));
});
尽管控制台返回display:none父元素的css值,但这不起作用.我想知道是否有人可以解释为什么父母不会被隐藏,以及可能有哪些替代隐藏它？
HTML
<div id="holder">
<div class="parent">
<div class="child">
</div>
</div>
</div>
CSS
#holder {
height: 50px;
width:50px;
background-color: blue
}
.parent {
position:fixed;
top:100px;
left:200px;
display:none;
width:200px;
height:200px;
background-color:red
}
.child {
position:absolute;
width:50px;
height:50px;
background-color:purple
}
JS
$(function(){
$('#holder').click(function(){
$(this).children('.parent').show();
});
$('.child').click(function(){
$(this).parent().hide();
console.log($(this).parent().css('display'));
});
});
我正在尝试使用 gulp 将一个文件复制到具有不同名称的同一目录 - 具有不同名称的文件已经存在。在 Unix 中这只是简单的cp ./data/file.json.bak ./data/file.jsongulp 似乎更棘手（我在 Windows 系统上）。
我试过了：
gulp.task('restore-json',function(){
return gulp.src('./data/file.json.bak')
.pipe(gulp.dest('./data/file.json',{overwrite:true}));
});
如果该文件存在，我会收到EEXIST错误。如果没有，它将创建file.json为目录。
我假设这个问题是因为 gulp 使用globbing并有效地将src和dest视为路径。你知道我可以做到这一点的最有效的方法吗？我想解决方法是将文件复制到 tmp 目录，然后使用 glob 通配符重命名和复制，但这是正确的方法吗？
请使用以下代码:
HTML
<button id="button>click me</button>
JS - 版本1
window.onload = init;
function init() {
console.log('init called');
var button = document.getElementById('button');
button.onclick = buttonClickHandler;
}
function buttonClickHandler() {
console.log('button clicked');
}
vs相同的HTML
JS - 版本2
window.onload = init();
在这两种情况下,"init called"会立即出现在控制台中,但在第二种情况下,会出现一个错误,指出按钮为空.
这里有2件事情在玩.1)在版本1中,它等待DOM在版本2中加载2),它在DOM加载之前发生,或者看起来如此.
我的问题.请尽可能清楚地解释版本1中发生的情况与版本2中发生的情况.什么window.onload = init是vs什么window.onload = init()是技术术语？还请解释每个版本的行为.为什么1等待,但2不等？
脚本需要在按钮元素之前,例如在头部:http://jsfiddle.net/XMEjr/1/