小编Ven*_*t.R的帖子

AngularJS.当select具有ng-model属性时,ng-selected不起作用

我正在尝试设置ng-selected我的option元素,selected属性设置为true,但未option选中,当我ng-model从中删除后select变得有效.

问题:option当我使用模型时如何选择?

这是我的plunker(selected不在这里工作)

我的代码:

var app = angular.module("plunker", []);

app.controller("TestController", ["$scope", function($scope) {
  $scope.test = 1;
  $scope.array = [
        {"id": 1, "name": "first"}, 
        {"id": 2, "name": "second"}, 
        {"id": 3, "name": "third"}
      ];
}]);
Run Code Online (Sandbox Code Playgroud)

我的模板:

  <body ng-controller="TestController">
    Selected item must be {{ array[test-1].name }}
    <select ng-model="myModel">
      <option value="">Choose item..</option>
      <option ng-repeat="item in array" 
              ng-value="item.id" 
              ng-selected="item.id == test">
        {{ item.name }} …
Run Code Online (Sandbox Code Playgroud)

angularjs angularjs-ng-model

5
推荐指数
1
解决办法
2319
查看次数

为什么我的Css代码不能用于我的Html页眉和页脚?

需要一些帮助...

在非常偷看的时刻,我必须明天完成这项工作,但我的CSS代码不适用于页眉和页脚,而相同的文件正在为字体系列,字体大小,正文背景颜色等其他东西工作...

    body {
	    font-family: Arial;
 	    font-size: 15px;
 	    line-height: 1.6em;
        background-color: linen;
    }

    .container {
	    border: 2px solid black;
  	    width: 70%;
 	    margin: 20px auto;
	    overflow: auto;
    }

    .Pull-Left {
	    Float: Left;
    }

    .Pull-Right {
	    Float: Right;
    }

    header {
	    background-color: blue;
    }

    footer {
	    background-color: blue;
    }
Run Code Online (Sandbox Code Playgroud)
    <!DOCTYPE html>
    <html>
    <head>
    <title>ABCD</title>
    <link rel="stylesheet" href="CSS/style.css" type="text/css">
    </head>
    <body>
    <div class="container">
    <header>
	<div class="Pull-Left">This Is The Main Title</div>
	<div class="Pull-Right">***Some Text***</div>
	</header>

	  </br></br></br></br></br></br></br></br>
	  </br></br></br></br></br></br></br></br>
	  </br></br></br></br></br></br></br></br>

    <footer>
	<div  class="Pull-Left">This Is The Footer</div> …
Run Code Online (Sandbox Code Playgroud)

html css html5 css3

4
推荐指数
1
解决办法
2866
查看次数

在webpack中使用velocity.js

我试图用一些地区materialize-css,js一些这些部件的依赖于速度和代码的一些其他块,我有依靠jQuery.我正在用webpack它来构建它.

要求速度对我来说不起作用,我还是得到了.velocity is not a function.我使用ProvidePlugin注入jQuery(与npm一起安装)使用$jQuery使用,这很好用.

plugins: [
  new webpack.ProvidePlugin({
    $: "jquery",
    jQuery: "jquery",
  })
]
Run Code Online (Sandbox Code Playgroud)

但是看起来像速度无法将velocity方法注入jQuery.我也尝试过:

module: {
  loaders: [
    {
      test: /jquery\.js$/,
      loader: "expose?jQuery!expose?$"
    }
Run Code Online (Sandbox Code Playgroud)

jquery webpack velocity.js

3
推荐指数
1
解决办法
1454
查看次数

按下回车键时对函数的 js 调用反应

这是我的 react js 应用程序中的一个片段:

<form className="rcw-sender" onKeyDown={(e)=> e.keyCode == 13 ? {sendMessage}: ''} onSubmit={sendMessage}>
  {this.state.active && <Container>
    <EmojiPicker />
  </Container>}
  <button className="rcw-send" onClick={activateEmoji}>
    <img src={emojibutton} className="rcw-send-icon" alt="send" />
  </button>
  <button className="rcw-send" onClick={activateMenu}>
    <img src={menubutton} className="rcw-send-icon" alt="send" />
  </button>

  <input type="text" className="rcw-new-message" name="message" placeholder={placeholder} disabled={disabledInput}
    autoFocus={autofocus} autoComplete="off" ref={this.input} />
  <button type="submit" className="rcw-send">
    <img src={send} className="rcw-send-icon" alt="send" />
  </button>
</form>
Run Code Online (Sandbox Code Playgroud)

onSubmit={sendMessage}当我按下提交按钮时,在我的表单中被调用,这非常有效。但是我希望在sendMessage按回车键提交表单时调用相同的方法。要做到这一点,我有这个代码onKeyDown={(e)=> e.keyCode == 13 ? {sendMessage}: ''},我希望sendMessage在按下回车键时调用该方法,但它似乎不起作用。我想这样做是因为我的应用程序中有一个表情符号选择器,当我使用回车键提交表单时,表情符号选择器就会出现。所以为了解决这个问题,我想sendMessage在按下回车键提交表单时调用该方法。使用提交按钮提交表单不会切换表情符号选择器的状态。这就是为什么作为快速解决问题的sendMessage方法,我想在按下 Enter 键时调用方法。我该怎么做?

javascript reactjs

3
推荐指数
1
解决办法
8810
查看次数

使用带有Babel的es7函数

我想在我的项目中包含es7函数,以开始在其中使用fetch等待异步方式.

我正在使用gulp,browserify和babelify(7.2.0),阅读一些文档,我看到说babelify使用es7函数的方法是将这一行包含在babelify转换中:

optional: ['runtime', 'es7.asyncFunctions']
Run Code Online (Sandbox Code Playgroud)

所以我的整个任务如下:

gulp.task('js',function(){



var bundleStream = browserify({

    entries:[config.paths.mainJs],
    debug: true,

    transform: [babelify.configure({
        presets:["es2015","react"],
        optional: ['runtime', 'es7.asyncFunctions']
    })]


}).transform("browserify-shim")
    .bundle()
    .on('error',console.error.bind(console))




bundleStream
    .pipe(source('compiled.js'))
    .pipe(buffer())
   // .pipe(uglify())
    .pipe(rename('compiled.min.js'))
    .pipe(gulp.dest(config.paths.dist + '/js'))


});
Run Code Online (Sandbox Code Playgroud)

不幸的是,运行任务时出现以下错误:

"未知选项:解析文件时的base.optional:"

谷歌搜索有点我看到babelify 7.x确实使用babel 6.0,显然这个参数可选在babel 6.0中不再存在.

我不想降级我的babelify版本来使这项工作,但我想包括es7功能与babelify版本7,有人知道如何做到这一点?

任何帮助将非常感激,因为没有太多关于它的信息

为了以防万一,请查找我的package.json文件:

"dependencies": {
"bootstrap": "^3.3.5",
"history": "^1.13.0",
"jquery": "^2.1.4",
"jquery-ui": "^1.10.4",
"jquery.easing": "^1.3.2",
"moment": "^2.10.2",
"react": "^0.14.3",
"react-bootstrap": "^0.28.1",
"react-dom": "^0.14.3",
"react-router": "^1.0.2",
"reflux": "^0.3.0"
},
"devDependencies": {
"babel-preset-es2015": "^6.1.18",
"babel-preset-react": "^6.1.18",
"babelify": "^7.2.0",
"browserify": "^9.0.8",
"browserify-shim": "^3.8.11", …
Run Code Online (Sandbox Code Playgroud)

javascript browserify gulp babeljs ecmascript-7

2
推荐指数
1
解决办法
2203
查看次数

如何避免模型臃肿与雄辩的模型?

我一直在努力在闲暇时间在Laravel做一个小游戏,我一直遇到麻烦,如何最好地构建应用程序和某些模型的问题变得非常臃肿.

我目前正在使用雄辩的模型并直接将功能附加到它们.例如,我有一个User模型,它从以下函数开始

$user->verify()
$user->creditGold()
$user->debitGold()
Run Code Online (Sandbox Code Playgroud)

这看似合理.当我向网站添加功能时,该类开始变得越来越笨重,例如:

$user->creditItem()
$user->debitItem()
$user->equipItem()
$user->unequipItem()
$user->moveToTown()
$user->takeQuest()
$user->ban()
$user->unban()
// etc. etc. 
Run Code Online (Sandbox Code Playgroud)

有很多代码感觉非常无关,已被推入这一类并且它非常混乱.

我开始做的是制作由User类实例化并保存的辅助模型.以下示例

$user->inventory()->creditItem()
$user->inventory()->debitItem()
$user->inventory()->useItem()
Run Code Online (Sandbox Code Playgroud)

它很容易打电话和使用,但感觉不正确.

有没有人有关于如何最好地分解大量代码的建议,这些代码在概念上属于同一个实体?我喜欢将功能与数据结合起来的想法,因为我认为这是理解OO的最自然的方式,但是我最好将代码抽象到服务层并使用服务类将用户作为参数和代替它(即$service->giveItemToUser($user, $item))?

php laravel

2
推荐指数
1
解决办法
509
查看次数

如果 mousedown 则触发 mousemove 否则什么都不做

我有一个技术问题,我不确定解决它的最佳方法是什么。

基本上我正在开发一个音频进度条,用户可以在其中更改歌曲的位置。这应该通过单击或保持鼠标按下并移动它来完成。

elem.addEventListener("mouseup", function(event){
  elem.removeEventListener("mousemove", fn);
});

elem.addEventListener("mousedown", function(event){
  elem.addEventListener("mousemove", function(event){
      // Stuff to do
  }, fn);
});
Run Code Online (Sandbox Code Playgroud)

所以本质上:

如果鼠标被按住然后移动做一些事情。如果释放鼠标,则防止触发mousemove

我知道如果我继续这样做它可能会起作用,但对我来说它看起来像是一团糟。我不想养成坏习惯。

我的问题是:我如何使用最佳实践使这项工作?

注意:我还尝试了以下操作:

function fn(event) {
if(event.button == 0) {
      elem.addEventListener("mousemove", function(event){
          // Stuff to do
      });
}
}
Run Code Online (Sandbox Code Playgroud)

我在这里缺少什么!

javascript mouseevent

1
推荐指数
1
解决办法
2143
查看次数

使用Float和布尔变量传播运算符问题

Spread Operator抛出float和boolean变量的错误.在float和boolean变量上获取错误是否有任何特定原因.

// Works, Array Variable
'use strict';

let aVal = [1, 2, 3];
console.log(...aVal);

// Works, String Variable
'use strict';

let sVal = 'String';
console.log(...sVal);

// throws error, Integer Variable
'use strict';

let iVal = 1234567890;
console.log(...iVal);

// throws error, Float Variable
'use strict';

let fVal = 99.45;
console.log(...fVal);

// throws error, Boolean Variable
'use strict';

let bVal = true;
console.log(...bVal);
Run Code Online (Sandbox Code Playgroud)

javascript ecmascript-6

0
推荐指数
1
解决办法
599
查看次数