下拉列表与.aspx页面中的angularjs绑定 [英] Dropdown list bind with angularjs in .aspx page

查看:59
本文介绍了下拉列表与.aspx页面中的angularjs绑定的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述



我正在使用materialize css来设计网页...我还使用了一个web服务和angularjs。



现在我想在.aspx页面中绑定一个下拉列表,其样式将实现css类型...



因此形成angularjs我得到了所有值但当我与dorpdown列表绑定时,则值不会出现..

如果我删除了materialize.min.css类,那么值即将来临....

may我是否会错过任何物质化的宣传...



可以任何人帮助PLZ ...



我尝试过:



这是我的代码:



< br $>


Hi,
I'm using materialize css to design the web page ... i'm also using one webservice , and angularjs .

now i want the bind a dropdown list in .aspx page , whose style will be materialize css type...

so form angularjs i got all values but when i bind with dorpdown list then value is not comming..
if i remove the materialize.min.css class then the value is comming ....
may be i miss any proparty of materializecss...

can any one help plz ...

What I have tried:

This is my code :



<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="demo.aspx.cs" Inherits="myApp.demo" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css" />
    <script type="text/javascript" src="Script/angular.min.js"></script>
    <script type="text/javascript">
        angular.module('myRole', []).controller('roleCtrl', function ($scope, $http) {
            $scope.allRoleList = null;
            $scope.getAllRole = function () {
                $http({
                    method: 'GET',
                    url: 'myService.asmx/GetRole',
                    data: {}
                }).then(function (result) {
                    // alert('ok');
                    $scope.allRoleList = result.data;
                    debugger;
                });
            };           
            $scope.getAllRole();
        });
    </script>

</head>
<body>
    <form id="form1" runat="server">
        <div class="container">
            <div ng-app="myRole" ng-controller="roleCtrl" class="input-field col s8 l6 m6">
                <select data-ng-model="role" data-ng-options="r.roleId as r.roleName for r in allRoleList">
                    <option value="">-- Select Role --</option>
                </select>

            </div>
        </div>
    </form>

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            $('select').material_select();
        });
    </script>
</body>
</html>

推荐答案

范围,


http){


scope.allRoleList = null;
scope.allRoleList = null;


这篇关于下拉列表与.aspx页面中的angularjs绑定的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆