相关疑难解决方法(0)

angular.element vs document.getElementById或带有旋转(忙)控件的jQuery选择器

我正在使用Spin控件的"Angularised"版本,如下所示:http://blog.xvitcoder.com/adding-a-weel-progress-indicator-to-your-angularjs-application/

我不喜欢所显示的解决方案之一是在服务中使用jQuery,有效地将旋转控件附加到DOM元素.我更喜欢使用角度构造来访问元素.我还想避免"硬编码"spinner需要附加到服务中的元素的id,而是使用一个指令来设置服务中的id(单例),以便服务的其他用户或服务本身不需要知道.

我正在努力使用angular.element给我们与同一元素id上的document.getElementById给出的内容.例如.这有效:

  var target = document.getElementById('appBusyIndicator');
Run Code Online (Sandbox Code Playgroud)

这些都不是:

  var target = angular.element('#appBusyIndicator');
  var target = angular.element('appBusyIndicator');
Run Code Online (Sandbox Code Playgroud)

我显然做的事情应该是相当明显的错误!任何人都可以帮忙吗?

假设我可以完成上述工作,我在尝试替换元素的jQuery访问时遇到了类似的问题:例如,$(target).fadeIn('fast'); 工作angular.element('#appBusyIndicator').fadeIn('fast')angular.element('appBusyIndicator').fadeIn('fast')不工作

有人能指出一个很好的文档示例,阐明Angular"元素"与DOM元素的使用吗?Angular显然用自己的属性,方法等"包装"元素,但通常很难获得原始值.例如,如果我有一个<input type='number'>字段,并且我想访问在用户输入" - "(没有引号)时在ui中可见的原始内容,我什么也得不到,大概是因为"type = number"意味着Angular拒绝输入,即使它在UI中可见,我想看到它,所以我可以测试它并清除它.

任何指针/答案赞赏.

谢谢.

jquery angularjs

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

调整角度材料设计中的侧面尺寸.

是否有角度材料的指令来调整sidenav的大小?

有一个sidenav显示客户端列表,右侧窗格显示客户端的详细信息.我想在它们之间添加一个调整大小栏.

我使用了以下内容

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

我在下面找到了

Angular JS可调整大小的div指令

我尝试按照上面的plunker示例,但sidenav从未调整过大小.右侧窗格向右移动,但左侧窗格保持不变.

<div layout="row" flex>

        <md-sidenav layout="column" class="md-sidenav-left md-whiteframe-z2" id="sidenav" md-component-id="left" md-is-locked-open="$mdMedia('gt-md')">
            <md-list class="sideBar">
                <md-item ng-repeat="client in data">
                    <md-item-content>
                        <md-button ng-click="selectClient(client);" >

                                {{client.name}} 
                        </md-button>
                    </md-item-content>
                </md-item>
            </md-list>
        </md-sidenav>

        <div id="sidebar-resizer" 
        resizer="vertical" 
        resizer-width="6" 
        resizer-left="#sidenav" 
        resizer-right="#primary-col"
        resizer-max="400">
    </div>
    <!-- viewport column -->

    <div layout="column" flex class="content-wrapper" id="primary-col">
        <div id="viewPort" ng-view></div>
    </div>
 </div> 
Run Code Online (Sandbox Code Playgroud)

谢谢

javascript css angularjs angularjs-directive angular-material

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