我还可以通过过滤器放置范围吗?

时间:2017-01-23 10:52:37

标签: javascript html angularjs database parsing

我做了一个taskfilter,如果选择了另一个按钮,我需要编辑标题的tekst,我尝试了一个范围,但如果范围不起作用,那么你们是否知道mayby的其他事情? / p>

我正在谈论的规则$ scope,infotitel,我也尝试将范围函数放在上面的过滤器中,但这也行不通。

继承我的过滤器代码

  

$ scope.infoTitel ='已完成&#39 ;; -------------我把它放在每个if语句中,因为点击它会将任务过滤成完成与否,但是我想用它来显示html中的tekst completted etcc

return function(values, taskCompleted) {

  // filter
  return values.filter(function(value){
    if(taskCompleted === 1) {
                $scope.infoTitel = 'completed';
        return value.completed;
    }
    else if(taskCompleted === 2){
                $scope.infoTitel = 'all';
        return true;
    }
            else if(taskCompleted === 3){
                $scope.infoTitel = 'deadline missed';
        return value.dateExpired;
    }
            // initially don't filter
            else if(!value.completed && !value.dateExpired){
                $scope.infoTitel = 'to do';
                return value;
            }

    //return $sce.trustAsHtml(output); voor als html verandert

  });
};

这是按钮

的部分
<div class="mini-nav">
            <a class="clear-completed" ng-click="taskfilter = 3" ng-class="{'active' : taskfilter == 3}">
                <span>deadline missed</span>.
            </a>
            <a class="clear-completed" ng-click="taskfilter = 2" ng-class="{'active' : taskfilter == 2}">
                <span>show all </span>.
            </a>
            <a class="clear-completed" ng-click="taskfilter = 1" ng-class="{'active' : taskfilter == 1}">
                <span>show completed</span>.
            </a>

            <a class="clear-completed" ng-click="taskfilter = 0" ng-class="{'active' : taskfilter == 0}" ng-init="">
                <span>to do</span>.
            </a>
        </div>

这是html,第一行是我要显示的地方

  

li ng-repeat =&#34; todo in tasks | filterTask:taskfilter&#34;纳克级=&#34; getCSSClass(待办事项)&#34; ------------- filterTask是我想要将范围tekst放入其中的自定义过滤器,因此是第一段代码。

     

{{infoTitel}}由家人

-----------这就是我想要的地方

<h1>{{ infoTitel }} by family</h1>

    <div id="main" style="display: block;">
        <ul id="todo-list" class="unstyled">
            <li ng-repeat="todo in tasks | filterTask:taskfilter " ng-class="getCSSClass(todo)" >
                <div class="view" ng-keyup="editTodo()">
                    <input type="checkbox" ng-click="toggleTodo(todo)" class="check-done-{{todo.completed}}"  ng-hide= "todo.dateExpired "/>
                    <span class="done-{{todo.completed}}">{{todo.task}} </span>
                    <p ng-show="todo.completed">completed by: {{ todo.completedBy.name }} </p>
                    <p ng-show="todo.completed">date completed : {{ todo.dateCompleted | date : "MMM d, y h:mm a" }}</p>
                    <p ng-hide="todo.completed" ng-if= " !todo.dateExpired ">task deadline : {{ todo.timeToDeadline || "no deadline" | date : "MMM d, y h:mm"  }}</p>
                    <p ng-hide="todo.completed" ng-if= " todo.dateExpired ">deadline missed on {{ todo.dateExpiration | date : "MMM d, y h:mm a"}}</p>
                    <div class="bar-holder" ng-show="todo.percentage || todo.percentage == 0"  ng-if="!todo.completed " >
                      <div class="bar" style="width: {{todo.percentage}}%;" ></div>
                    </div>
                </div>
                <input class="edit" type="text" ng-model="todo.text" ng-keyup="editOnEnter(todo)" />
            </li>
        </ul>

1 个答案:

答案 0 :(得分:0)

我发现问题我可以改变按钮内的tekst,添加另一个点击并直接在那里添加tekst所以它在家庭

{{infoTitel}}的地方显示

<div class="mini-nav">
            <a class="clear-completed" ng-click="taskfilter = 'missed'; infoTitel = 'Deadline missed'" ng-class="{'active' : taskfilter == 'missed'}">
                <span>deadline missed</span>
            </a>
            <a class="clear-completed" ng-click="taskfilter = 'all'; infoTitel = 'All'" ng-class="{'active' : taskfilter == 'all'}">
                <span>show all </span>
            </a>
            <a class="clear-completed" ng-click="taskfilter = 'completed'; infoTitel = 'Completed'" ng-class="{'active' : taskfilter == 'completed'}">
                <span>show completed</span>
            </a>
            <a class="clear-completed" ng-click="taskfilter = 'todo'; infoTitel = 'To do'" ng-class="{'active' : taskfilter == 'todo'}" ng-init="">
                <span>to do</span>
            </a>
        </div>

ps:将3,2,1,0个文件名更改为miss,all,completed和todo以更好地理解过滤器