小编ada*_*ors的帖子

如何在AngularJS中的父控制器或作用域中访问FormController

我有一个包含多种表单的页面,我只想一次显示一个.为此,我将每个表单分成一个部分并使用Bootstrap的手风琴插件我一次只允许一个打开的部分.

我的标记看起来像这样:

<a ng-click="open_section('section1')">Section 1</a>

<div collapse="section1">
  <form name="section1Form">
  </form>
</div>

<a ng-click="open_section('section2')">Section 2</a>

<div collapse="section2">
  <form name="section2Form">
  </form>
</div>
Run Code Online (Sandbox Code Playgroud)

一切正常,我可以在表格等之间导航

因为我不希望用户打开一个部分,如果他们当前正在编辑的部分包含验证错误,我尝试检查open_section函数是否与之关联的表单有效.

我试过了,但我做不到.我无法访问与负责页面的控制器中的表单关联的FormController.出于某种原因,他们没有在范围上发表.

这是我试过的:

  • $scope.section1Formundefined

  • 尝试过$scope.$watch('section1Form, function(){}),仍未定义

  • 尝试添加表单的名称作为第二个参数,open_section如此:open_section('section1', section1Form)但在函数中第二个参数是undefined.

<form></form>标签之间,我可以访问FormController,但在我们之外我没有.由于事件来自<form>(关闭,打开部分)之外,我无法将FormController传递给我的控制器以检查我的表单的有效性.

有没有办法解决这个问题,还是应该重构我的页面?

我正在使用Angular 1.1.5顺便说一句.

另外,使用AngularJS Batarang Chrome插件进行检查,我可以看到表单作为子范围发布到当前范围.

编辑:这是范围层次结构查找此应用程序的方式

 - root
 |
 ---current controller\'s scope
 |
 ----scope that contains the forms
Run Code Online (Sandbox Code Playgroud)

这是因为我正在使用ng-include?那么在控制器中无法访问这些表单吗?

javascript forms angularjs angularjs-scope

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

AngularJs清空表单并从输入中删除无效状态

我正在使用表单将元素添加到表单一侧显示的列表中.标记是:

  <form name="thingForm">
      <input required type="text" ng-model="thing.name"/>
      <input required type="text" ng-model="thing.value"/>
      <input type="submit" ng-click="addThing(thing)"/>
    </form>
    <ul>
      <li ng-repeat="thing in things">{{thing.name}} with value of {{thing.value}}</li>
    </ul>
Run Code Online (Sandbox Code Playgroud)

在控制器中我有:

$scope.things = [];
$scope.addThing = function(thing) {
    $scope.things.push(thing);
    $scope.thing = {};
};
Run Code Online (Sandbox Code Playgroud)

工作jsfiddle:http://jsfiddle.net/cXU2H/1/

现在您可以看到,我可以通过清空模型来清空表单,但是由于输入具有必需的标记,浏览器仍会显示错误消息(至少Chrome会这样做).

我看了类似的问题,并且:

  • 我也看了这个答案:https://stackoverflow.com/a/16296941/545925然而jsfiddle的行为与我的例子完全相同:输入被清除后仍然有一个ng-invalid-required类剩余(并且它也触发HTML5错误消息)
  • 因为我不在1.1.x分支$setPristine()上,因此我无法使用 $setPristine() 表现方式相同

我当然可以编写一个函数来遍历表单的元素并删除每个类ng-invalid-requiredng-invalid类,但这不是我想要解决的方法.这就是我用jQuery做的事情.

javascript angularjs

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

找不到Angular.js angular-dragdrop自定义回调函数

我正在使用Angular的这个插件.在文档中它说

要调用的onDrop回调方法将draggable放入droppable中

所以我尝试使用它(相关部分是onDrop ="myCallback"):

<div class="thumbnail" data-drop="true" 
        onDrop="myCallback" ng-model='list1' 
        data-jqyoui-options="optionsList1" 
        jqyoui-droppable="{multiple:true}">
    <div class="caption">
        <div class="btn btn-info btn-draggable" 
              ng-repeat="item in list1" 
              ng-show="item.title" 
              data-drag="{{item.drag}}" 
              data-jqyoui-options="{revert: 'invalid'}" 
              ng-model="list1" jqyoui-draggable="{index: {{$index}},animate:true}">                
        {{item.title}}
        </div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

并在范围内定义了函数,如下所示:

$scope.myCallback = function(event, ui){
    console.log('Dropped into something');
};
Run Code Online (Sandbox Code Playgroud)

http://plnkr.co/edit/kiYrIU?p=preview

正如您从Plunker中看到的那样,这不起作用,由于某种原因找不到回调函数(它可能没有查看范围?).

我已尝试过多种变体,例如onDrop="myCallback(event, ui)"onDrop="myCallback"等等.这些都没有奏效.

这是一个错误还是我没有正确使用它?

提前致谢.

javascript jquery-ui angularjs jquery-draggable

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

Yii CHtml :: radioButtonList - 水平对齐的CSS

我正在使用yii框架进行开发.我编写CSS并能够<input正确地在html中对齐我的标签,并且我对yii使用相同的CSS并且对齐方式搞砸了.有人可以帮我吗?

我希望它显示如下

我希望它显示如下

这是我的yii代码

<div id="gender">
        <label>Gender :</label>
        <?php echo CHtml::radioButtonList('gender_code','',array('Male'=>'Male','Female'=>'Female'),array('separator'=>'')); ?>
    </div>
Run Code Online (Sandbox Code Playgroud)

CSS

 <style type="text/css">          
           div#gender {
                    margin-top:20px;
                    margin-left:200px;
           }      

           div#gender label
           {
                   font-weight: bold;
                   font-size: 0.9em;
                   float:left;
                   margin-left:2px;
                   text-align:left;
                   width:100px;
            }

</style>
Run Code Online (Sandbox Code Playgroud)

它正如下图所示

在此输入图像描述

css radiobuttonlist yii

5
推荐指数
2
解决办法
2万
查看次数

使用自定义函数对象比较器c ++设置

我有一个文件,它的第一行是英文字母,按随机顺序,然后是名字.我应该根据给出的字母对名称进行排序.我的班级看起来像这样:

class MyCompare(){
   private:
     static map<char, int> order;
   public:
     MyCompare(string alphabet){
        //loop through the string, assign character to it's index in the map
        // order[ alphabet[i] ] = i;
     }
     bool operator()(const string s1, const string s2) {
        //compare every character using compchar, return the result
     }
     bool compchar(const char c1, const char c2){
        return order[c1]<order[c2];
     }        
Run Code Online (Sandbox Code Playgroud)

}

在主要方面,我做了这样的事情:

int i=0;

if (myfile.is_open()) {
    while ( myfile.good() ) {
        i++;
        getline (myfile,line);
        if(i ==1){
            MyCompare st(line);
            set<string, MyCompare> words(st);                
        } …
Run Code Online (Sandbox Code Playgroud)

c++

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

在Yii框架上使用ajaxButton/ajaxSubmitButton阻止加载jQuery资产

我的布局上有jQuery加载资产,我想使用CHtml::ajaxButton/ajaxSubmitButton.但是当我在运行时使用它与另一个渲染时,它再次加载jQuery资源并产生错误.如何防止脚本加载?

<?php echo CHtml::ajaxSubmitButton( 'Submit',
                                        CHtml::normalizeUrl(array('site/AjaxRequest/30')),
                                        array(
                                        'error'=>'js:function(){
                                            alert(\'error\');
                                        }',
                                        'beforeSend'=>'js:function(){
                                            alert(\'beforeSend\');
                                        }',
                                        'success'=>'js:function(data){
                                            alert(\'data from server: \'+data);
                                        }',
                                        'complete'=>'js:function(){
                                            alert(\'complete\');
                                        }',
                                        //'update'=>'#response',
                                        )
                                    );
    ?>
Run Code Online (Sandbox Code Playgroud)

javascript php jquery yii

3
推荐指数
2
解决办法
4770
查看次数

下拉列表中的角度ng-repeat

我正试图ng-repeat在Angular中这样做:

   <select ng-model="selected_item">
        <option ng-repeat="item in items" value="{{item.id}}"
                ng-change="doSomething(selected_item)">
        {{item.name}} - {{item.another_attribute}}
        </option>
    </select>
Run Code Online (Sandbox Code Playgroud)

并得到错误No controller: ngModel.

通常我会构建下拉列表,ng-options但由于选项的标签由两个不同的属性组成,因此它不起作用.

<select ng-model="selected_item" 
        ng-options="item.id as item.name for item in items" 
        ng-change="doSomething(selected_item)">
Run Code Online (Sandbox Code Playgroud)

如您所见,我不能在这里使用两个属性作为标签.

有任何想法吗?

javascript angularjs angularjs-ng-repeat

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