각도 js에 위쪽/아래쪽 화살표 표시

각도 js로 분류기가있는 테이블을 만들었습니다.
하지만 내 코드에 위/아래 화살표를 표시 할 수 없습니다. 내가 뭘 잘못 했습니까?각도 js에 위쪽/아래쪽 화살표 표시

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

    .controller("myController",function($scope){ 

var employees=[ 
{name:"suha",dob:new Date("november,20,1995"),gender:"female",salary:"57300.00"}, 
{name:"Yashu",dob:new Date("august,25,1997"),gender:"female",salary:"47653.0000"}, 
{name:"sneha",dob:new Date("july,30,1999"),gender:"female",salary:"43300.00"} 
]; 
$scope.employees=employees; 
$scope.sortColumn="name"; 
$scope.reverseSort=false; 

$scope.sortData=function(column){ 
    $scope.reverseSort=($scope.sortColumn==column)? !$scope.reverseSort : false; 
    $scope.sortColumn=column; 
} 
$scope.getSortClass=function(column){ 
    if($scope.sortColumn==column){ 
     return $scope.reverseSort ? 'arrow-down' : 'arrow-up'; 
    } 

    return ''; 
} 

});

table,tr,td{ 
    border:1px solid; 
    padding:10px; 
} 
.arrow-up,.arrow-down{ 
    width:0; 
    height:0; 
    border-right: 5px transparent; 
    border-left: 5px transparent; 
    border-bottom-color: 10px solid black; 
    display: inline-block; 

}

전체 코드 : https://jsfiddle.net/4vy9m3h1/

출처

2017-03-07 user7397787

당신은 잡히지 않습니다 ReferenceError : 각도가 정의되지 않았습니다 오류? –

Yah.In 나의 지역은 올바른 출력을 얻고 있습니다. 화살표 만 표시되지 않습니다. 그러나 여기에 '잡히지 않은 참조 오류'가 표시됩니다. 이유를 모르겠다. 참조를 추가해야합니까? – user7397787

코드가 제대로 작동하는지 확인하여 피들을 바꾸도록 도울 수 있습니다. –

<th ng-click="sortData('name')" ng-class="getSortClass('name')"> 
    Name 
</th>

업데이트 작업 fiddle

를 참조 아래처럼 th에 ng-class 추가 fiddle 화살표 아이콘 :

출처

2017-03-07 05:59:44

감사합니다. Fiddle이 잘 작동하고 있습니다. 화살표가 표시되지 않는지 확인하십시오. – user7397787

@ user7397787 CSS로 문제. 참고 http://stackoverflow.com/questions/11712011/how-to-create-uparrow-downarrow-using-simple-css –

@ user7397787 업데이트 된 [fiddle] (https://jsfiddle.net/gangadharjannu/1xkkucpv/)을 확인하십시오.) –

문제는 실제로 CSS에 있습니다. 이 작업을해야합니다 : 당신은 즉,이 속성 border-bottom-color 내에서 속기를 사용하여 잘못된 특성/값을 입력 한

table,tr,td{ 
    border:1px solid; 
    padding:10px; 
} 

.arrow-up{ 
    width:10px; 
    height:10px; 
    border-right: 5px solid transparent; 
    border-left: 5px solid transparent; 
    border-bottom: 10px solid black; 
    display: inline-block; 
} 

.arrow-down{ 
    width:0; 
    height: 0; 
    border-right: 5px solid transparent; 
    border-left: 5px solid transparent; 
    border-bottom: 10px solid black; 
    display: inline-block; 
}

출처

2017-03-07 06:10:09

각도 js에 위쪽/아래쪽 화살표 표시

답변

관련 문제