随着AngularJS 2出来,该文档暗示三种语言:
Typescript,Javascript和Dart.
我只习惯Javascript EcmaScript 5,我想知道这三者的优点和缺点是什么？
在提出这个问题的时候,文档更多地是在Typescript上开发的,而在其他文档上则相当渺茫(甚至是他们自己的语言Dart):
我是否应该改变使用Javascript进行开发的习惯并遵循Angular 2使用Typescript建议的内容？它真的改变了Javascript的概念吗？
AngularJS 2.0官方网站
我有一个Vue.js应用程序,我对一系列项目进行了v-repeat.我想将newItem添加到项目列表中.当我尝试this.items.push(this.newItem)推送的对象仍然绑定到输入.考虑以下内容:
new Vue({
el: '#demo',
data: {
items: [
{
start: '12:15',
end: '13:15',
name: 'Whatch Vue.js Laracast',
description: 'Watched the Laracast series on Vue.js',
tags: ['learning', 'Vue.js', 'Laracast', 'PHP'],
note: "Vue.js is really awesome. Thanks Evan You!!!"
},
{
start: '13:15',
end: '13:30',
name: "Rubik's Cube",
description: "Play with my Rubik's Cube",
tags: ['Logic', 'Puzzle', "Rubik's Cube"],
note: "Learned a new algorithm."
}
],
newItem: {start: '', end: '', name: '', description: '', tags: '', note: ''} …使用Bootstrap工具提示时,我们需要编写类似这样的内容来获得工具提示功能:
$(".showtooltip").tooltip();
但问题是,每次通过ajax加载新内容时,我们都需要重新运行该代码.无论如何都要运行代码一次并在加载新元素时自动应用工具提示？
谢谢.
如果字段不正确,我想阻止用户单击"注册"按钮.部分原因是必须填写某些字段.但条件开始变得有点长:
<button class="btn btn-success" ng-click="register()"
ng-disabled="signInForm.$invalid || form.firstName.length==0 ||
form.lastName.length==0 || form.email.length==0 ||
form.password.length==0 || form.passwordBis.length==0">Register</button>
我该如何简化？
我正在尝试将a的值存储contenteditable到我的JS代码中.但我无法找出为什么ng-model在这种情况下不起作用.
<div ng-app="Demo" ng-controller="main">
<input ng-model="inputValue"></input>
<div>{{inputValue}}</div> // Works fine with an input
<hr/>
<div contenteditable="true" ng-model="contentValue"></div>
<div>{{contentValue}}</div> // Doesn't work with a contenteditable
</div>
有没有办法解决这个问题？
请参阅:JSFiddle
注意:我正在创建一个文本编辑器,因此用户应该看到结果,而我将HTML存储在其后面.(即用户看到:"这是一个例子!",同时我店:This is an <b>example</b> !)
当我点击一个按钮时,会出现一个滑块.(这里是它的样子的一个例子,不要注意这段代码)
滑块通过动画显示.动画结束后,我应该包含一个我从服务器加载的HTML页面.我需要在动画之后在滑块中应用HTML,否则动画停止(重新计算DOM).
等待数据准备就绪并完成转换
为什么？如果我在动画期间应用HTML,它会在将新HTML添加到DOM时停止动画.所以我等到第4步之前结束.
这是缩短的代码:
// Start loading data & animate transition
var count = 0;
var data = null;
++count;
$.get(url, function (res) {
data = res;
cbSlider();
});
// Animation starts here
++count;
$(document).on('transitionend', '#' + sliderId, function () {
$(document).off('transitionend', '#' + sliderId);
cbSlider()
});
function cbSlider() {
--count;
// This condition is only correct when both GET request and animation are finished
if …我正在使用本地化过滤器刷新问题.加载文件后,视图不会刷新.我试过$scope.$apply()和$filter("localization")(localizationService.text),也不是工作.
本地化服务:
angular
.module("myApp")
.factory("localizationService", function () {
var service = {
text: null,
language: "en"
};
return service;
});
定位过滤器:
angular
.module("myApp")
.filter("localization", function(localizationService) {
return function (value) {
if (localizationService.text && localizationService.text.hasOwnProperty(value)) {
return localizationService.text[value];
}
return value;
}
});
控制器自动刷新要使用的文件:
$scope.$watch(function () {
return $location.path();
}, function () {
var fileName = "../Localizations/" + $location.path().substring(1) + "/localization-" + localizationService.language + ".json";
$http.get(fileName).then(function (response) {
localizationService.text = response.data;
//$filter("localization")(localizationService.text);
//$scope.$apply();
});
});
本地化en.json:
{ …直到现在,我正在使用.xaml.cs来处理输入.
这是我的xaml头代码:
<Window x:Class="My_Windows_App.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:vm="clr-namespace:My_Windows_App.ViewModel"
Title="MainWindow" Height="600" Width="900"
Keyboard.KeyDown="keyDownEventHandler" Keyboard.KeyUp="keyUpEventHandler">
这是MainWindow.xaml.cs代码的一部分:
public partial class MainWindow : Window
{
private bool pushToTalk;
public void keyDownEventHandler(object sender, KeyEventArgs e)
{
if (e.Key == Key.LeftCtrl)
pushToTalk = true;
}
public void keyUpEventHandler(object sender, KeyEventArgs e)
{
if (e.Key == Key.LeftCtrl)
pushToTalk = false;
}
}
我怎样才能在MVVM中实现同样的东西？因为据我所知,我们不能绑定一个方法,只有属性,对吧？
我正在使用解析数组$.each(),但在其中,我正在使用.splice()方法,所以我需要向后迭代.可能吗 ？
var store = [...];
//...
var rules = [...];
//...
$.each(store, function(index, element) { // This loop needs to iterate backward
$.each(rules, function(index2, rule) {
if (element.id == rule.id) {
store.splice(index, 1);
}
});
});
警告:
for,我只是想知道它是否可以实现使用$.each当拖动的元素位于其上方时,我遇到了突出显示拖放区域(使用dropZone指令定义)的问题.
我试过用CSS:
.highlight {
background-color: rgba(0, 255, 0, 0.2);
}
.highlight:hover {
background-color: rgba(0, 255, 0, 0.5);
}
但这不起作用,因为我拖动一个元素,因此hover它在可拖动元素上.
这是代码:
var app = angular.module("myApp", []);
app.directive("dragCopy", function($http, $compile, $document) {
return {
restrict: 'A',
link: function($scope, $element) {
$element.on("mousedown", function($event) {
$event.preventDefault();
var newNode = $compile('<div class="dragFile" draggable-file>drag</div>')($scope);
newNode.children("#title").text($element.parent().text());
angular.element($document[0].body).append(newNode);
newNode.css({
top: $event.pageY - (newNode.prop("offsetHeight") * 0.9) + "px",
left: $event.pageX - (newNode.prop("offsetWidth") / 2) + "px",
});
newNode.triggerHandler("mousedown");
});
}
}
});
app.factory("dragDropService", function() {
var object …