角UI的選擇CSS不與UI的引導

我想在我的項目中使用的角度ui-select但不知何故的CSS工作不正常工作。角UI的選擇CSS不與UI的引導

的index.html：

<link rel="stylesheet" href="bower_components/bootstrap-social/bootstrap-social.css" /> 
    <link rel="stylesheet" href="bower_components/angularjs-slider/dist/rzslider.css" /> 
    <link rel="stylesheet" href="bower_components/angular-dropdowns/dist/angular-dropdowns.css" /> 
    <link rel="stylesheet" href="bower_components/angular-loading-bar/build/loading-bar.css" /> 
    <link rel="stylesheet" href="bower_components/textAngular/dist/textAngular.css" /> 
    <link rel="stylesheet" href="bower_components/perfect-scrollbar/src/perfect-scrollbar.css" /> 
    <link rel="stylesheet" href="bower_components/fullcalendar/dist/fullcalendar.css" /> 
    <link rel="stylesheet" href="bower_components/angularjs-toaster/toaster.css" /> 
    <link rel="stylesheet" href="bower_components/ngprogress/ngProgress.css" /> 
    <link rel="stylesheet" href="bower_components/angular-ui-select/dist/select.css" /> 
    <script src="bower_components/ng-file-upload-shim/ng-file-upload-shim.js"></script> 
    <script src="bower_components/perfect-scrollbar/src/perfect-scrollbar.js"></script> 
    <script src="bower_components/angular-perfect-scrollbar/src/angular-perfect-scrollbar.js"></script> 
    <script src="bower_components/moment/moment.js"></script> 
    <script src="bower_components/fullcalendar/dist/fullcalendar.js"></script> 
    <script src="bower_components/angular-ui-calendar/src/calendar.js"></script> 
    <script src="bower_components/angularjs-geolocation/src/geolocation.js"></script> 
    <script src="bower_components/angularjs-toaster/toaster.js"></script> 
    <script src="bower_components/ngprogress/build/ngProgress.js"></script> 
    <script src="bower_components/angular-ui-select/dist/select.js"></script>

包版本：

Angularjs: 1.4.5 
ui-bootstrap: 0.11.2 
Angular ui-select: 0.12.1

HTML文件：

<ui-select ng-model="stream.selected" theme="select2" ng-disabled="disabled" style="min-width: 300px;"> 
    <ui-select-match placeholder="Select a social profile in the list">{{$select.selected.name}}</ui-select-match> 
    <ui-select-choices repeat="profile in socialNetworks | filter: $select.search"> 
    <div ng-bind-html="profile.name | highlight: $select.search"> </div> 
    </ui-select-choices> 
</ui-select>

controller.js

'use strict'; 

angular.module('myApp') 
    .controller('AddStreamPopUpCtrl', function ($scope, $modalInstance, $state, socialNetworks, $modal) { 

     $scope.close = function() { 
     $modalInstance.dismiss('close'); 
     }; 

     $scope.cancel = function() { 
     $modalInstance.dismiss('cancel'); 
     }; 

     $scope.redirect = function() { 
     $state.go('dashboard.mailbox.inbox'); 
     $modalInstance.dismiss('close'); 
     }; 

      $scope.socialNetworks = [{name:'test', value: 'someVal'}]; 
    });

以上代碼的結果看起來是這樣的：

誰能指點爲什麼這不是正確加載CSS？

來源

2015-09-04 dark_shadow

？ – bob

這不適用於任何主題。不知何故，我的HTML沒有出現在早些時候的問題..更新， –

你沒有下載select2.css。嘗試使用多選示例中顯示的'select2'主題。 – bob

Plunker example修改爲不下載 'select2.css'。

嘗試

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/select2/3.4.5/select2.css">

您正在使用什麼主題

來源

2015-09-04 20:27:37 bob

感謝鮑勃爲我工作:)雖然我仍然可以看到一些問題，如果我使用選擇2＃4.0.0參見本http://plnkr.co/edit/9RmB8aGddne6Ypy0dKBe?p=preview –

@dark_shadow我你是否有特別的理由使用4.0.0而不是3.4.5？ – bob

嗯，我剛剛選擇默認最初的最新版本。後來發現它與3.4.5不兼容。無論如何，我認爲他們很快就會使它與最新版本兼容。我在他們的github頁面上更新了一個相同的問題。感謝您的幫助:) –

角UI的選擇CSS不與UI的引導

回答

相關問題