这两个bean当然要在系统中申明，否则无法实现DI。在faces-config.xml文件中添加内容：
＜MANAGED-BEAN>
＜MANAGED-BEAN-NAME>SayHello＜/MANAGED-BEAN-NAME>
＜MANAGED-BEAN-CLASS>
org.bromon.jsf.model.hello.SayHello
＜/MANAGED-BEAN-CLASS>
＜MANAGED-BEAN-SCOPE>request＜/MANAGED-BEAN-SCOPE>
＜/MANAGED-BEAN>
＜MANAGED-BEAN>
＜MANAGED-BEAN-NAME>HelloDelegater＜/MANAGED-BEAN-NAME>
＜MANAGED-BEAN-CLASS>
org.bromon.jsf.control.hello.HelloDelegater
＜/MANAGED-BEAN-CLASS>
＜MANAGED-BEAN-SCOPE>request＜/MANAGED-BEAN-SCOPE>
＜MANAGED-PROPERTY>＜PROPERTY-NAME>sayHello＜/PROPERTY-NAME>
＜VALUE>#{SayHello}＜/VALUE>
＜/MANAGED-PROPERTY>
＜/MANAGED-BEAN>
＜MANAGED-BEAN-NAME>SayHello＜/MANAGED-BEAN-NAME>
＜MANAGED-BEAN-CLASS>
org.bromon.jsf.model.hello.SayHello
＜/MANAGED-BEAN-CLASS>
＜MANAGED-BEAN-SCOPE>request＜/MANAGED-BEAN-SCOPE>
＜/MANAGED-BEAN>
＜MANAGED-BEAN>
＜MANAGED-BEAN-NAME>HelloDelegater＜/MANAGED-BEAN-NAME>
＜MANAGED-BEAN-CLASS>
org.bromon.jsf.control.hello.HelloDelegater
＜/MANAGED-BEAN-CLASS>
＜MANAGED-BEAN-SCOPE>request＜/MANAGED-BEAN-SCOPE>
＜MANAGED-PROPERTY>＜PROPERTY-NAME>sayHello＜/PROPERTY-NAME>
＜VALUE>#{SayHello}＜/VALUE>
＜/MANAGED-PROPERTY>
＜/MANAGED-BEAN>
在后一个bean中，它的sayHello属性被指定要在运行时注入一个org.bromon.jsf.model.hello.SayHello的实例。
下面要编写表示层的页面，只有一个index.jsp：
需要引入两个标签库：
＜%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
＜%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
下面是构造jsf标签：
＜?XML:NAMESPACE PREFIX = F />
＜?XML:NAMESPACE PREFIX = H />＜H:FORM>
＜H:PANELGRID columns="3">
＜H:OUTPUTLABEL for="name" value="姓名:">，/H:OUTPUTLABEL>
＜H:INPUTTEXT id=name value="#{HelloDelegater.name}" required="true">＜/H:INPUTTEXT>＜H:MESSAGE for="name">＜/H:MESSAGE>
＜H:OUTPUTLABEL value="#{HelloDelegater.result}">＜/H:OUTPUTLABEL>
＜/H:PANELGRID>
＜H:PANELGROUP>
＜H:COMMANDBUTTON action="#{HelloDelegater.say}" value="提交">＜/H:COMMANDBUTTON>
＜/H:PANELGROUP>
＜/H:FORM>
＜/F:VIEW>
＜?XML:NAMESPACE PREFIX = H />＜H:FORM>
＜H:PANELGRID columns="3">
＜H:OUTPUTLABEL for="name" value="姓名:">，/H:OUTPUTLABEL>
＜H:INPUTTEXT id=name value="#{HelloDelegater.name}" required="true">＜/H:INPUTTEXT>＜H:MESSAGE for="name">＜/H:MESSAGE>
＜H:OUTPUTLABEL value="#{HelloDelegater.result}">＜/H:OUTPUTLABEL>
＜/H:PANELGRID>
＜H:PANELGROUP>
＜H:COMMANDBUTTON action="#{HelloDelegater.say}" value="提交">＜/H:COMMANDBUTTON>
＜/H:PANELGROUP>
＜/H:FORM>
＜/F:VIEW>
页面中包含了一个文本框和一个label，他们分别被绑定到了HelloDelegater类的两个属性上，具体的绑定工作有系统通过翻转控制的方式调用对应的set/get方式实现。提交按钮被绑定到了HelloDelegater.say方法，该方法会把计算结果赋给result属性，它会在页面中显示出来。
因为我们在url pattern中选择了*.faces,所以我们应该访问如下地址来查看程序:
http://localhost:8080/hello/index.faces
相应的,如果你选择了/faces/*,那么就应该是:
http://localhost:8080/hello/faces/index.jsp
程序执行结果如下：
下一篇文章中，将介绍一个更加复杂的用户管理程序，可以更清楚的看到jsf的特征，还会涉及到jsf的model对象一些组件的使用。