在AngularJS中,我可以使用ng-model选项去抖模型.
ng-model-options="{ debounce: 1000 }"
Run Code Online (Sandbox Code Playgroud)
如何在Angular中去抖模型?我试图在文档中搜索debounce,但我找不到任何东西.
https://angular.io/search/#stq=debounce&stp=1
一个解决方案是编写我自己的去抖函数,例如:
import {Component, Template, bootstrap} from 'angular2/angular2';
// Annotation section
@Component({
selector: 'my-app'
})
@Template({
url: 'app.html'
})
// Component controller
class MyAppComponent {
constructor() {
this.firstName = 'Name';
}
changed($event, el){
console.log("changes", this.name, el.value);
this.name = el.value;
}
firstNameChanged($event, first){
if (this.timeoutId) window.clearTimeout(this.timeoutID);
this.timeoutID = window.setTimeout(() => {
this.firstName = first.value;
}, 250)
}
}
bootstrap(MyAppComponent);
Run Code Online (Sandbox Code Playgroud)
而我的HTML
<input type=text [value]="firstName" #first (keyup)="firstNameChanged($event, first)">
Run Code Online (Sandbox Code Playgroud)
但是我正在寻找一个内置函数,Angular中有一个吗?
所以我正在使用基于组件的角度方法,假设我有一个名为的指令 <home></home>;
import template from './home.html';
import controller from './home.controller.js';
angular.module('myApp')
.directive('home', homeDirective);
let homeDirective = () => {
return {
restrict: 'E',
template,
controller,
controllerAs: 'vm',
bindToController: true
};
};
Run Code Online (Sandbox Code Playgroud)
现在我可以<home></home>在我的路由中使用该组件,如下所示:
angular.module('myApp')
.config(($routeProvider) => {
$routeProvider.when('/', {
template: '<home></home>'
})
})
Run Code Online (Sandbox Code Playgroud)
我真的很喜欢这种方法,但是使用"旧"方法,我习惯在我的routeconfig中使用"resolve"来仅在解析promise时呈现组件:
angular.module('myApp')
.config(($routeProvider) => {
$routeProvider.when('/', {
templateUrl: './home.html',
controller: './home.controller.js',
resolve: {
message: function(messageService){
return messageService.getMessage();
}
})
})
Run Code Online (Sandbox Code Playgroud)
题
如何在角度中使用基于组件的方法的解决方案?AAJ
我正在建立一个使用wordpress作为后端的网站,并将angularjs作为前端.我正在使用wordpress json API将我的数据传输到前端.
https://wordpress.org/plugins/json-api/
问题
我正在使用angular从wordpres json API获取我的数据.我创建了以下服务:
this.getPage = function ( slug ) {
return $http.get('wordpress/api/get_page/?slug=' + slug)
}
Run Code Online (Sandbox Code Playgroud)
我在我的控制器中使用此服务来获取当前页面
HTTPService.getPage('home')
.success(function ( data ) {
$scope.page = data.page;
console.log(arguments);
})
.error( function () {
console.log(arguments);
})
Run Code Online (Sandbox Code Playgroud)
所以这在所有浏览器中都运行良好,除了safari iOS.在Safari iOS上,如果我记录错误参数,我会得到以下响应:

这是safari调试器,我将我的iphone连接到我的macbook.我得到的错误响应是错误代码0 ..
到目前为止我尝试过的
我在htaccess文件中设置了"Access-Control-Allow-Origin"*",但这似乎不起作用.请求是在相同的域上使用相对URL完成的,所以我甚至不认为这是问题所在.
那么任何人都知道为什么这不适用于safari(仅限iOS)?
提前致谢...
编辑
一些额外的信息要求:
我想知道是否可以检测iOS用户是否正在使用webapp,或者只是使用safari浏览器访问正常方式.
我想要实现的原因是,当用户点击链接时,在iOS webapp上,他将被重定向到Safari浏览器.所以我使用以下解决方法让他留在webapp(阻止切换到safari浏览器).
$( document ).on("click",".nav ul li a",
function( event ){
// Stop the default behavior of the browser, which
// is to change the URL of the page.
event.preventDefault();
// Manually change the location of the page to stay in
// "Standalone" mode and change the URL at the same time.
location.href = $( event.target ).attr( "href" );
}
);
Run Code Online (Sandbox Code Playgroud)
但我希望这种解决方法只在用户使用webapp时发生,我希望它对webapp用户有条件.所以不在默认的safari浏览器上.
我有一个问题,用javascript打开一个新窗口.我在一个名为"theCode"的var中有HTML代码;
var j = window.open('')
j.document.write(theCode);
j.document.close();
Run Code Online (Sandbox Code Playgroud)
以下代码工作正常,但在chrome中我无法保存新文档或查看源代码(禁用选项).在Firefox中它很好.Chrome中是否有针对此的解决方法?
当使用javascript(es2015)导入时,Intellisense似乎被打破了.
当我在同一个文件中工作时,VSC使用正确的JSDoc信息从对象中自动提取方法.
但是,当在另一个文件中导入Class时,Intellisense似乎完全被破坏了(david.david,wtf?).
我是否需要调整Visual Studio Code中的任何设置才能使其正常工作?我尝试将我的jsconfig文件调整为es2015 import和es6 as,但是没有用.
我的jsconfig.json:
{
"compilerOptions": {
"module": "es6"
}
}
Run Code Online (Sandbox Code Playgroud) javascript intellisense jsdoc ecmascript-6 visual-studio-code
ESDOC似乎只针对ES6级风格.
有没有办法记录像以下的普通对象:
/**
* ???
*/
var Foo = {
/**
* ???
*/
info: true
};
export default Foo;
Run Code Online (Sandbox Code Playgroud)
即使使用ES6类样式,如何记录静态属性,如:
class Bar {
}
/**
* ???
*/
Bar.info = true;
export default Bar;
Run Code Online (Sandbox Code Playgroud) 我用css3创建了一个翻转动画.在webkit浏览器上,翻盖看起来很好,但在firefox中,翻转动画无法正常工作.您可以看到翻转动画有效,但它看起来非常"怪异"并且不会一直翻转.
我的HTML:
<li class="employee">
<div class="employee_container">
<div class="front flip">
<img src="http://www.piratealumni.com/s/722/images/editor/headshots/AshleyPerson.jpg" alt="">
</div>
<div class="back flip">
<h2>Title</h2>
<h3>Lorem ipsum</h3>
<p>Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum.</p>
</div>
</div>
</li>
Run Code Online (Sandbox Code Playgroud)
我的CSS:
.employee {
width:33%;
float:left;
display:block;
padding:0.5em;
height:20em;
}
.employee_container {
height:100%;
position:relative;
-webkit-perspective: 800px;
-moz-perspective: 800px;
-ms-perspective: 800px;
-o-perspective: 800px;
perspective: 800px;
}
.back, .front {
border: 3px solid #cecece;
position:absolute;
}
.front img {
min-height:100%;
height:auto;
width:100%;
}
.front {
overflow:hidden;
width:100%;
height:100%;
z-index:900;
-webkit-transform: rotateX(0deg) …Run Code Online (Sandbox Code Playgroud) 所以,我在输入元素上有一个自定义样式,我想在输入上放置一些文本:after.
我遇到的问题是我似乎无法改变:after元素的字体权重,这个问题只发生在元素input和:after元素的组合上.
CSS
input[type="checkbox"] { /* enable styling of the checkbox ! */
-moz-appearance: none;
-webkit-appearance: none;
}
input { /* set up some basic styles.... */
background-color:#ccc;
width:200px;
height:200px;
background-color:grey;
}
input:after { /* and we create the :after element */
width:100%;
text-align:center;
font-weight:100; /* THIS DOESN'T WORK FOR SOME REASON */
content: "This should be thin"; /* some text */
}
Run Code Online (Sandbox Code Playgroud)
的jsfiddle
测试
Chrome for mac(最新)
题
为什么我不能在:after …
文档没有提到它.
https://esdoc.org/manual/usage/tags.html
任何人都知道如何在ESDoc中记录对象文字,并生成一个报告,用于描述具有所有方法和值的对象.想知道如何记录以下标记.
/**
* @??
*/
export default {
/**
* @??
*/
myProperty: 1,
/**
* @??
*/
myFunction: () => {}
}
Run Code Online (Sandbox Code Playgroud) javascript ×8
html ×3
angularjs ×2
css ×2
css3 ×2
esdoc ×2
jquery ×2
ajax ×1
angular ×1
css-content ×1
ecmascript-6 ×1
intellisense ×1
ios ×1
jsdoc ×1
wordpress ×1